2

出于某种原因，我真的需要保留这个 onclick，但我不能让它做我想做的事。如果单击了上一个徽标，我想要的是将正文滑动到下一个徽标。

它看起来像这样：

<div class="logos">
    <div class="logo" id="logo1"><a href="javascript:// something" onclick="slide()"><img src="..."></a></div>
    <div class="logo" id="logo2"><a href="javascript:// something" onclick="slide()"><img src="..."></a></div>
    <div class="logo" id="logo3"><a href="javascript:// something" onclick="slide()"><img src="..."></a></div>
</div>

接着：

function slide() {

    var ind = $(this).closest('.logo').index();
    var $logos = $('.logo');
    var $next = $logos.eq(++ind);

    var timer_slide = window.setTimeout(start_slide, 300);

    function start_slide() {

            if ($next.length) {
                var where = $next.offset().top;
            } else {
                var where = $logos.filter(":first").offset().top;
            }
            $('body, html').animate({
                scrollTop: where
            })

    }

}

///////////////////////////////////////// ///////////////////////////////////////// ///////////////////////////////////////// //////////////////////

如果我这样做，它会起作用：

<div class="logos">
    <div class="logo" id="logo1"><a href="javascript:// something"><img src="..."></a></div>
    <div class="logo" id="logo2"><a href="javascript:// something"><img src="..."></a></div>
    <div class="logo" id="logo3"><a href="javascript:// something"><img src="..."></a></div>
</div>

 $("#logo1").click(function(){

        var ind = $(this).closest('.logo').index();
        var $logos = $('.logo');
        var $next = $logos.eq(++ind);

        var timer_slide = window.setTimeout(start_slide, 300);

        function start_slide() {

                if ($next.length) {
                    var where = $next.offset().top;
                } else {
                    var where = $logos.filter(":first").offset().top;
                }
                $('body, html').animate({
                    scrollTop: where
                })

        }

    });

我不能使用有效的原因是因为一切都由主 html 控制，而我所有其他外部按钮都是通过 onclick="..." 完成的，除此之外它运行良好。

如果有人知道如何使 onclick 与此滑块一起使用，我将不胜感激。

非常感谢。

4

1 回答 1

0

Worked for the answer..
Here's the URL of the codes: http://fiddle.jshell.net/zepyp/
Simply onclick on the first image it autoscrolls animatedly to the first logo, onclick on the second image it autoscrolls animatedly to the second logo and like that for the third image.

于 2013-05-25T18:04:13.947 回答