【问题标题】:Slide to left ul li via JavaScript通过 JavaScript 向左滑动 ul li
【发布时间】:2013-04-02 09:07:40
【问题描述】:

我有这个结构:

<div style="background-color:#FFF;height:49px;border-top:1px solid #ef4723;clear:both">
  <div id="marka-slider" class="row">
    <ul>
      <?php if (($references = Reference::getAll())) :
              foreach ($references as $r) :
      ?>
        <li>
          <img src="<?php echo Reference::getUploadPath() . '/' . $r->mediapath; ?>"
               alt="<?php echo $r->title; ?>" title="<?php echo $r->title; ?>"/>
               <!-- <?php CVarDumper::dump(array('ref: ' => $r->attributes), 5, 1); ?>  -->
        </li>
      <?php endforeach; ?>
      <?php endif; ?>
    </ul>

  </div>
</div>

JS:

var slider;
$(document).ready(function () {
  slider = $('#marka-slider ul li');

  setTimeout(function() {
    bgscroll('right');
  }, 1000);
});

function bgscroll(direction) {
  var sign;
    if (direction === 'left') {
      slider.stop().animate({'background-position': '+=10000'}, 200000, 'linear', bgscroll);
    } else {
      slider.stop().animate({'background-position': '-=10000'}, 200000, 'linear', bgscroll);
    }

但它不起作用。当我通过 Firebug 检查时,它没有给出错误。我该如何解决?

DEMO

【问题讨论】:

  • 您是否尝试滑动图片??
  • @Charlie 是的。我试试
  • 请给我在 div 中使用的类行的定义
  • 你的 bgscroll 函数没有右大括号
  • 你的演示中没有包含 CSS

标签: javascript jquery slider jquery-animate


【解决方案1】:

http://jsfiddle.net/xpVRT/2/

您正在为li 标记的背景图像设置动画,而图像位于img 标记中的li 内。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2021-11-14
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-06-10
    • 1970-01-01
    • 2014-07-07
    • 1970-01-01
    相关资源
    最近更新 更多