如何从SlidesJS.com在SlideJS中自动切换幻灯片?

时间:2017-01-13 23:24:03

标签: javascript jquery slideshow slide slidesjs

我正在努力让SlideJS运行,并按顺序介绍演示和行为的某些方面。

我还没有管理的一件事就是让它自动滑动或转换到一张幻灯片。

获得报告错误的代码是SlideJS的主插件文件中的第67行,除了下面的右括号之外的最后一行;我的副本位于https://cjshayward.com/wp-content/Slides-SlidesJS-3/source/jquery.slides.js

  if (typeof TouchEvent !== "undefined") {
    $.data(this, "touch", true);
    this.options.effect.slide.speed = this.options.effect.slide.speed / 2;
  }

通过我的调用注释掉赋值可以抑制报告的错误,但我认为代码可能需要比此行更多的信息,这似乎只是将现有设置减半。我可以分配,而不会立即报告错误,

this.options.effect['qwerty'] = 'qwerty';

但是我得到一个类似的错误(即设置undefined属性),如果我有多少:

this.options.effect.slide['qwerty'] = 'qwerty';

我尝试过多种配置选项,我可以看到手动圈点击可以在幻灯片之间移动,但尚未设法自动转换(该插件支持幻灯片或淡入淡出选项;我想要'幻灯片效应)。我目前的选择目标是:

<script>// <![CDATA[
    jQuery(function(){
      jQuery('#slides').slidesjs({
        slide:
            {
            speed: 200
            },
        interval: 2000,
        active: true,
        auto: true,
        effect: 'slide',
        height: 528,
        interval: 5000,
        pauseOnHover: true,
        restartDelay: 2500,
        swap: false,
        width: 940
      });
    });
// ]]></script>

在view-source:http://www.slidesjs.com/中,有多个示例invocatiosn,但我在slidejs.min.js包含之后看到的唯一调用(从URL加载的最后一个脚本)是:

  <script>
    $(function() {
      $('#slides').slidesjs({
        width: 940,
        height: 350,
        navigation: false
      });
    });
  </script>

谢谢,

2 个答案:

答案 0 :(得分:1)

请看: -

https://jsfiddle.net/5x2tqdsv/

您需要修复您的html并删除以下行: -

HTML = '''\
<table cellpadding="5" cellspacing="0" class="borders" width="100%">
    <tr>
     <th colspan="2">
      Learning Outcomes
     </th>


... omitting most of what you had here


      Prepare and present the financial statements of a Sole Trader  in prescribed format from a Trial Balance  accompanies by notes with additional information.
     </td>
    </tr>
   </table>'''

from io import StringIO
import pandas as pd

df = pd.read_html(StringIO(HTML))
print (df)

答案 1 :(得分:0)

有两个问题。

一个是HTML需要修复。

另一个是选项正在呈现,平坦,http://www.slidesjs.com/examples/playing/的来源有:

    $(function() {
      $('#slides').slidesjs({
        width: 940,
        height: 528,
        play: {
          active: true,
          auto: true,
          interval: 4000,
          swap: true,
          pauseOnHover: true,
          restartDelay: 2500
        }
      });
    });

我目前拥有我想要的一切,除了最初在Hijax之前显示的数据(我应该能够解决这几种方式,并且它不是我的关注)。除了HTML问题之外,还有另外一个问题我在尝试使用平面字典来指定选项时需要有一个选项/键(play)将自己的字典作为值而不是例如一个数字或布尔值作为其大多数其他选项的显示方式。

从现在开始工作的更新后的JSfiddle我是https://jsfiddle.net/ydvtynjL/