«
»

2013, java, jquery

Slider jquery

01.13.13 | Comment?

Alberto Suárez Pérez

Simple marquesina jquey estructura con list. Aquí puedes verla en funcionamiento.

Puedes configurar las opciones de espera y duración además de si quieres que se detenga al pasar el cursor.
‘delay’:2000,
‘duration’:900,
‘stop’:true

//Plugin start
 (function($)
   {
     var methods = 
       {
         init : function( options ) 
         {
           return this.each(function()
             {
               var _this=$(this);
                   _this.data('marquee',options);
               var _li=$('>li',_this);
                   
                   _this.wrap('
') .height(_this.height()) .hover(function(){if($(this).data('marquee').stop){$(this).stop(true,false);}}, function(){if($(this).data('marquee').stop){$(this).marquee('slide');}}) .parent() .css({position:'relative',overflow:'hidden','height':$('>li',_this).height()}) .find('>ul') .css({width:screen.width*2,position:'absolute'}); for(var i=0;ili',$this).width()*-1}, $this.data('marquee').duration, 'swing', function() { $this.css('left',0).append($('>li:first',$this)); $this.delay($this.data('marquee').delay).marquee('slide'); } ); } }; $.fn.marquee = function(m) { var settings={ 'delay':2000, 'duration':900, 'stop':true }; if(typeof m === 'object' || ! m) { if(m){ $.extend( settings, m ); } return methods.init.apply( this, [settings] ); } else { return methods[m].apply( this); } }; } )( jQuery ); //Plugin end //call $(document).ready( function(){$('.slide').marquee({delay:3000});} );

Etiquetas: , ,

Comments are closed.


«
»