Skip to content

Instantly share code, notes, and snippets.

@Kcko
Last active June 22, 2018 13:59
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Kcko/6918587 to your computer and use it in GitHub Desktop.
Save Kcko/6918587 to your computer and use it in GitHub Desktop.
Jquery - plugin, funkce, vl. selektor
1/
(function($){
$.extend({
jYoutube: function( url, size ){
if(url === null){ return ""; }
size = (size === null) ? "big" : size;
var vid;
var results;
results = url.match("[\\?&]v=([^&#]*)");
vid = ( results === null ) ? url : results[1];
if(size == "small"){
return "http://img.youtube.com/vi/"+vid+"/2.jpg";
}else {
return "http://img.youtube.com/vi/"+vid+"/0.jpg";
}
}
})
})(jQuery);
2/
$.test = function(text)
{
$("#ahoj").text(text);
}
$.test("blaaaa");
3/
/*
* jTwitter 1.1.1 - Twitter API abstraction plugin for jQuery
*
* Copyright (c) 2009 jQuery Howto
*
* Licensed under the GPL license:
* http://www.gnu.org/licenses/gpl.html
*
* URL:
* http://jquery-howto.blogspot.com
*
* Author URL:
* http://jquery-howto.blogspot.com
*
*/
(function( $ ){
$.extend( {
jTwitter: function( username, numPosts, fnk ) {
var info = {};
// If no arguments are sent or only username is set
if( username == 'undefined' || numPosts == 'undefined' ) {
return;
} else if( $.isFunction( numPosts ) ) {
// If only username and callback function is set
fnk = numPosts;
numPosts = 5;
}
var url = "http://twitter.com/status/user_timeline/"
+ username + ".json?count="+numPosts+"&callback=?";
$.getJSON( url, function( data ){
if( $.isFunction( fnk ) ) {
fnk.call( this, data );
}
});
}
});
})( jQuery );
--------------
použití
$(document).ready(function(){
// Get latest 6 tweets by jQueryHowto
$.jTwitter('jQueryHowto', 10, function(data){
$('#posts').empty();
$.each(data, function(i, post){
$('#posts').append(
'<div class="post">'
+' <div class="txt">'
// See output-demo.js file for details
+ post.text
+' </div>'
+'</div>'
);
});
});
});
4/
$.fn.makeRed = function() {
return $(this).css('background', 'red');
}
$('#myTable').find('.firstColumn').makeRed().append('hello');
5/
$.extend(
$.expr[':'],
{
over100pixels: function(a) {
return $(a).height() > 100;
}
});
$('.box:over100pixels').click(function() {
alert('The element you clicked is over 100 pixels high');
});
(function($){
$.fn.extend({
//plugin name - animatemenu
animateMenu: function(options) {
var defaults = {
animatePadding: 60,
defaultPadding: 10,
evenColor: '#ccc',
oddColor: '#eee',
};
var options = $.extend(defaults, options);
return this.each(function() {
var o =options;
var obj = $(this);
var items = $("li", obj);
$("li:even", obj).css('background-color', o.evenColor);
$("li:odd", obj).css('background-color', o.oddColor);
items.mouseover(function() {
$(this).animate({paddingLeft: o.animatePadding}, 300);
}).mouseout(function() {
$(this).animate({paddingLeft: o.defaultPadding}, 300);
});
});
}
});
})(jQuery);
======================
(function ($) {
$.fn.textHover = function (options) {
var defaultVal = {
Text: 'Your mouse is over',
ForeColor: 'red',
BackColor: 'gray'
};
var obj = $.extend(defaultVal, options);
return this.each(function () {
var selObject = $(this);
var oldText = selObject.text();
var oldBgColor = selObject.css("background-color");
var oldColor = selObject.css("color");
selObject.hover(function () {
selObject.text(obj.Text);
selObject.css("background-color", obj.BackColor);
selObject.css("color", obj.ForeColor);
},
function () {
selObject.text(oldText);
selObject.css("background-color", oldBgColor);
selObject.css("color", oldColor);
}
);
});
}
})(jQuery);
======================
jQuery.fn.firstPlugin = function () {
return this.each (function () {
alert (this.id);
});
}
======================
jQuery.fn.extend ({
myFirstFunction : function () { alert ("first function") },
thisIsTheSecond : function (message) { alert ("2nd: "+ message) }
});
$.myFirstFunction ();
$.thisIsTheSecond ("hello");
======================
jQuery.expr[":"].startsWith = function (element, index, tokens) {
if (!tokens[3]) return false;
return eval ("/^[/s]*" + tokens[3] + "/i").test ($(element).text());
};
======================
(function($){
$.fn.truncate = function(options) {
var defaults = {
length: 300,
minTrail: 20,
moreText: "more",
lessText: "less",
ellipsisText: "..."
};
var options = $.extend(defaults, options);
return this.each(function() {
obj = $(this);
var body = obj.html();
if(body.length > options.length + options.minTrail) {
var splitLocation = body.indexOf(' ', options.length);
if(splitLocation != -1) {
// truncate tip
var splitLocation = body.indexOf(' ', options.length);
var str1 = body.substring(0, splitLocation);
var str2 = body.substring(splitLocation, body.length - 1);
obj.html(str1 + '<span class="truncate_ellipsis">' + options.ellipsisText +
'</span>' + '<span class="truncate_more">' + str2 + '</span>');
obj.find('.truncate_more').css("display", "none");
// insert more link
obj.append(
'<div class="clearboth">' +
'<a href="#" class="truncate_more_link">' + options.moreText + '</a>' +
'</div>'
);
// set onclick event for more/less link
var moreLink = $('.truncate_more_link', obj);
var moreContent = $('.truncate_more', obj);
var ellipsis = $('.truncate_ellipsis', obj);
moreLink.click(function() {
if(moreLink.text() == options.moreText) {
moreContent.show('normal');
moreLink.text(options.lessText);
ellipsis.css("display", "none");
} else {
moreContent.hide('normal');
moreLink.text(options.moreText);
ellipsis.css("display", "inline");
}
return false;
});
}
} // end if
});
};
})(jQuery);
======================
$.fn.myPlugin = function(options, callback) {
if (typeof callback == 'function') { // make sure the callback is a function
callback.call(this); // brings the scope to the callback
}
};
$.fn.myPlugin = function() {
// extend the options from pre-defined values:
var options = $.extend({
callback: function() {}
}, arguments[0] || {});
// call the callback and apply the scope:
options.callback.call(this);
};
Using:
$('.elem').myPlugin({
callback: function() {
// some action
}
});
$.fn.showWhenScrolled=function(){
var self = this;
this.init = function(){
self.each(function(){
var self_top = $(this).offset().top;
var scroll_top = $(window).scrollTop();
var win_height = $(window).height();
var frame = $(this).find('iframe');
if(scroll_top > (self_top - win_height)){
if(!frame.attr('src')){
frame.attr({src:frame.attr('title')});
}
}
});
};
$(window).scroll(function(){
self.init();
}).resize(function(){
self.init();
});
self.init();
};
$('.youtube-container').showWhenScrolled();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment