$(document).ready(function(){ $(‘#menu li ul’).css({ display:”none”, left:”auto” }); $(‘#menu li’).hoverIntent(function(){ $(this) .find(‘ul’) .stop(true,true) .slideDown(‘fast’); },function(){ $(this) .find(‘ul’) .stop(true,true) .fadeOut(‘fast’); }); });
Category: jQuery
Expandable menus
$(document).ready(function(){ $(‘#menu > li > ul’) .hide() .click(function(event){ event.stopPropagation(); }); $(‘#menu > li’).toggle(function(){ $(this).find(‘ul’).slideDown(); },function(){ $(this).find(‘ul’).slideUp(); }); }); #menu {
scrolling gallery
$(document).ready(function(){ $(‘#pic_container’).click(function(){ var numberOfPics=$(this).find(‘div > img’).length; var next = Math.floor(Math.random()*numberOfPics); $(this) .scrollTo( ‘#pic_scroller>img:eq(‘+next+’)’,{duration:1000} ); }); }); /** * jQuery.ScrollTo *
thumbnail scroller
$(document).ready(function(){ $(‘#photos_inner’).toggle(function(){ var scrollAmount = $(this).width()-$(this).parent().width(); $(this).animate({‘left’:’-=’+scrollAmount},’slow’); },function(){ $(this).animate({‘left’:’0′},’slow’); }); }); #photos { overflow: hidden; width: 600px; } #photos_inner {
cycle สามารถทำ shuffle,zoom, fade,turnDown,curtainX,scrollRight
ไม่ support IE 6 $(document).ready(function(){ $(‘#photos’).cycle({ fx:’shuffle’ //เปลี่ยนได้ shuffle,zoom, fade,turnDown,curtainX,scrollRight }); }); /* * jQuery Cycle Plugin (with Transition Definitions)
Inner fade
$(document).ready(function(){ $(‘#news ul’).innerfade({ animationtype:’slide’, speed:750, timeout:3000, type:’random’ }); }); /* ========================================================= // jquery.innerfade.js // Datum: 2008-02-14 // Firma: Medienfreunde Hofmann
slide cross fade
$(document).ready(function(){ rotatePics(1); }); function rotatePics(currentPhoto){ var numberOfPhoto=$(‘#photos img’).length; currentPhoto=currentPhoto % numberOfPhoto; $(‘#photos img’).eq(currentPhoto).fadeOut(function(){ $(‘#photos img’).each(function(i){ $(this).css( ‘zIndex’,((numberOfPhoto-i)+currentPhoto) % numberOfPhoto );
color box plugin
$(document).ready(function(){ $(‘a[rel=celeb]’).colorbox({ transition: ‘fade’, speed: 500, current: “{current} of {total} celebrity photos”, width:’100%’, height:’100%’ }); }); /* ColorBox Core Style
Light BOX Custom
$(document).ready(function(){ $(‘a.lightbox’).click(function(e) { $(‘body’).css(‘overflow-y’, ‘hidden’); // hide scrollbars! $(‘<div id=”overlay”></div>’) .css(‘top’, $(document).scrollTop(0)) .css(‘opacity’, ‘0’) .animate({‘opacity’: ‘0.5’}, ‘slow’) .appendTo(‘body’); $(‘<div id=”lightbox”></div>’)
