Полезные сниппеты на jQuery
Предзагрузка изображений
(function($) {
var cache = [];
// Arguments are image paths relative to the current page.
$.preLoadImages = function() {
var args_len = arguments.length;
for (var i = args_len; i--;) {
var cacheImage = document.createElement('img');
cacheImage.src = arguments[i];
cache.push(cacheImage);
}
}
jQuery.preLoadImages("image1.gif", "/path/to/image2.png");
var cache = [];
// Arguments are image paths relative to the current page.
$.preLoadImages = function() {
var args_len = arguments.length;
for (var i = args_len; i--;) {
var cacheImage = document.createElement('img');
cacheImage.src = arguments[i];
cache.push(cacheImage);
}
}
jQuery.preLoadImages("image1.gif", "/path/to/image2.png");
Пока изображение не загрузилось будет светиться image1.gif
Замена target=”blank”
$('a[@rel$='external']').click(function(){
this.target = "_blank";
});
this.target = "_blank";
});
Как-то так и откроется в новом окне
Плавный скролл до якоря
$(document).ready(function() {
$("a.topLink").click(function() {
$("html, body").animate({
scrollTop: $($(this).attr("href")).offset().top + "px"
}, {
duration: 500,
easing: "swing"
});
return false;
});
});
$("a.topLink").click(function() {
$("html, body").animate({
scrollTop: $($(this).attr("href")).offset().top + "px"
}, {
duration: 500,
easing: "swing"
});
return false;
});
});
Плавное затухание ссылки при наведении
$(document).ready(function(){
$(".thumbs img").fadeTo("slow", 0.6); // This sets the opacity of the thumbs to fade down to 60% when the page loads
$(".thumbs img").hover(function(){
$(this).fadeTo("slow", 1.0); // This should set the opacity to 100% on hover
},function(){
$(this).fadeTo("slow", 0.6); // This should set the opacity back to 60% on mouseout
});
});
$(".thumbs img").fadeTo("slow", 0.6); // This sets the opacity of the thumbs to fade down to 60% when the page loads
$(".thumbs img").hover(function(){
$(this).fadeTo("slow", 1.0); // This should set the opacity to 100% on hover
},function(){
$(this).fadeTo("slow", 0.6); // This should set the opacity back to 60% on mouseout
});
});
Колонки одинаковой высоты
var max_height = 0;
$("div.col").each(function(){
if ($(this).height() > max_height) { max_height = $(this).height(); }
});
$("div.col").height(max_height);
$("div.col").each(function(){
if ($(this).height() > max_height) { max_height = $(this).height(); }
});
$("div.col").height(max_height);
Получить параметры урла
$.urlParam = function(name){
var results = new RegExp('[\\?&]' + name + '=([^]*)').exec(window.location.href);
if (!results) { return 0; }
return results[1] || 0;
}
var results = new RegExp('[\\?&]' + name + '=([^]*)').exec(window.location.href);
if (!results) { return 0; }
return results[1] || 0;
}
Tweet
Рекомендую к просмотру:
- Функция рекурсивного создания директорий
- Ticker`ы на jQuery
- Функция вывода времени в текстовом формате
- HTML5 Placeholder Attribute
- Ошибка Call to undefined function json_decode() или json_encode()
Блог » JavaScript / / 18.12.11 / Комментарии [1] / Печать