Question

以下是我的Javascript和Html幻灯片代码，可以自动启动幻灯片。现在我正在尝试在鼠标悬停在上时启动此幻灯片。但我不能。有可能或我该怎么做？

Html Head Section Javascript代码：

<link rel="stylesheet" href="css/global.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="js/slides.min.jquery.js"></script>
<script>
    $(function(){
        $('#slides').slides({
            preload: true,
            preloadImage: 'img/loading.gif',
            play: 5000,
            pause: 2500,
            hoverPause: true,
            animationStart: function(current){
                $('.caption').animate({
                    bottom:-35
                },100);
                if (window.console && console.log) {
                    // example return of current slide number
                    console.log('animationStart on slide: ', current);
                };
            },
            animationComplete: function(current){
                $('.caption').animate({
                    bottom:0
                },200);
                if (window.console && console.log) {
                    // example return of current slide number
                    console.log('animationComplete on slide: ', current);
                };
            },
            slidesLoaded: function() {
                $('.caption').animate({
                    bottom:0
                },200);
            }
        });
    });
</script>

Html Body Section Code：

<div id="container">
    <div id="example">          
        <div id="slides">
            <div class="slides_container">                
                <div class="slide">
<a href="#"><img src="img/slide-1.jpg" width="570" height="270" alt="Slide 
1"></a>             
                </div>
                <div class="slide">
<a href="#"><img src="img/slide-2.jpg" width="570" height="270" alt="Slide 
2"></a>                     
                </div>                      
            </div>              
        </div>
<img src="img/example-frame.png" width="739" height="341" alt="Example Frame" id="frame">
    </div>
</div>

Answer 1

尝试命名您的函数（而不是匿名$(function(){ ...），然后在其中一个div（{slide“或”example“或”containiner“）的onmouseover事件中按名称调用它

Answer 2

您使用的是SlidesJS插件吗？

http://www.slidesjs.com/

鼠标悬停在Javascript幻灯片开始

2 个答案: