首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >JQuery Marquee滑台

JQuery Marquee滑台
EN

Stack Overflow用户
提问于 2014-02-11 13:08:34
回答 1查看 1.2K关注 0票数 0

赫,

只是一个新手试图完成一些事情,而我的想法是,我有一个ul,它是用jquery函数标记出来的,它的左标牌意味着它的滑动左边,我想要做的就是让它滑到顶部。

我在这里做了个工作小提琴

http://jsfiddle.net/arafays/wnXh8/

代码语言:javascript
复制
(function($)
{
 var methods = 
   {
     init : function( options ) 
     {
       return this.each(function()
         {
           var _this=$(this);
               _this.data('marquee',options);
           var _li=$('>li',_this);

               _this.wrap('<div class="slide_container"></div>')
                    .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:'relative'});

               for(var i=0;i<Math.ceil((screen.width*3)/_this.width());++i)
               {
                 _this.append(_li.clone());
               } 

           _this.marquee('slide');});
     },

     slide:function()
     {
       var $this=this;
       $this.animate({'left':$('>li',$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':4000,
                 'duration':2000,
                 '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 );


  jQuery(document).ready(
function(){jQuery('.some ul').marquee({delay:3000});}
  );

我只想让它向上滑动,而不是向左滑动,我试着添加顶部,做一些其他的事情,但是它使完全的ul幻灯片向上移动,留下了空白。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2014-02-11 13:33:27

是像这样吗?

http://jsfiddle.net/wnXh8/5/

代码语言:javascript
复制
$this.animate({'top':$('>li',$this).height()*-1},
                       $this.data('marquee').duration,
                     'swing',
                     function()
                     {
                       $this.css('top',0).append($('>li:first',$this));
                       $this.delay($this.data('marquee').delay).marquee('slide');

                     }
                    );
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/21702749

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档