请帮我解决jquery幻灯片

我用jQuery easyslider创建了幻灯片。但没有发生。我无法找到问题的具体位置。请帮我解决jquery幻灯片

的JavaScript如下：

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("#slider").easySlider({ 
      auto: true, 
      continuous: true 
     }); 
    }); 
</script>

..和相应的HTML：

<div id="slider"> 
    <ul>     
     <li><img src="Beauty/1.jpg" /></li> 
     <li><img src="Beauty/2.jpg" /></li> 
     <li><img src="Beauty/3.jpg" /></li> 
     <li><img src="Beauty/4.jpg" /></li> 
     <li><img src="Beauty/5.png" /></li>   
    </ul> 
</div>

来源

2011-04-16 mythri

你应该告诉我们预期的行为是什么。无论如何，我得到的错误* Uncaught TypeError：无法读取null *的属性'样式'。并且请在你的帖子中包含你的JS代码的相关部分。 – 2011-04-16 12:09:08

我正在使用easySlider1.7.js，它太大而无法发布。我如何发布？ – mythri 2011-04-16 12:21:58

@mythri：你不应该发布'easySlider1.7.js'的代码，但是你写的**相关**代码。 *我如何发布？*：编辑您的问题并添加代码。 – 2011-04-16 12:24:07

你张贴在这里的代码工作。我已经安装了一个小提琴：http://jsfiddle.net/jomanlk/jFePh/

在HTML页面中查看您的代码有几个问题。

的图像实际上并不存在，所以你不会知道是否它反正正常
你的显示/隐藏代码似乎并不奏效（toggleMe('para2')我认为）。它并不实际显示所有的容器。
#slider保持隐藏状态，UL内部只是在pt/px之间切换。

你的标记似乎没问题，但是你的JS没有像你期望的那样工作。我假设Dreamweaver在页面顶部包含了很多JS。在将任何功能添加到页面之前，您可能需要清除所有这些并获得基本工作。

编辑

你是有关easySlider如何计算出的尺寸有问题。

你开始与

<div id="para3" style="display:none">

当easySlider代码踢，它试图找出尺寸。由于高度和宽度都设置为0它的数字它不能实际做的幻灯片，并放弃（这是过于简单化）

这可以在该小提琴我设置可以看出：http://jsfiddle.net/jomanlk/jFePh/2/

解决方法是从您的DIV中删除display:none，并使用JS 将其隐藏后，easySlider已加载并完成其位。

所以要解决这个问题。

取出style属性，并添加一个类，所以它看起来像这样<div id="para1" class="hideMeLater">
更改JS在你的文件的顶部，它看起来像下面的

 
    $(document).ready(function(){ 
     $("#slider").easySlider({ 
      auto: true, 
      continuous: true 
     }); 
     $('.hideMeLater').hide();//hiding all the divs we removed display:none from 
    });

这应该做解决您的幻灯片问题。我在这里设置了一个小样：http://jsfiddle.net/jomanlk/jFePh/3/

另外，我建议你熟悉JS和jquery，这样你就可以理解包含插件时实际发生的情况。网上有一些优秀的教程。

此外，你应该清理你的HTML。

来源

2011-04-16 12:53:34 JohnP

@John：谢谢..只要做到这一点，并尝试。 – mythri 2011-04-16 12:56:45

仍然没有工作:( – mythri 2011-04-16 13:08:43

如果我删除隐藏/显示选项（toggleMe（'para2'）），它可以正常工作，但我希望它与隐藏/显示选项。我该怎么做？ – mythri 2011-04-16 13:12:01

你有id="slider"多个元素尽量给唯一的ID .. 我认为THN它会工作...

来源

2011-04-16 12:55:02 asharajay

将尝试。谢谢 – mythri 2011-04-16 12:57:08

如果我删除隐藏/显示选项（toggleMe（'para2'），它工作正常。但我希望它与隐藏/显示选项。我该怎么做？ – mythri 2011-04-16 13:50:01

请帮我解决jquery幻灯片

回答

相关问题