0

我有一个 div#conteudo和 2 个链接#linkPrev和#linkNext.

当悬停在链接上时，它会.animate()向左或向右 div #conteudo。

html:

<div id="conteudo">
    <div class="boxes" id="content1">
    <div class="boxes" id="content2">
    <div class="boxes" id="content3">
</div>
<a id="linkPrev" class="linksNav"></a>
<a id="linkNext" class="linksNav"></a>

CSS：

#conteudo{width:2000;position:relative; height:1080px;}
.box{width:0; overflow:hidden; float:left;}

js：

$('#linkNext').on({

                mouseenter: function(){
                    if ($('#conteudo .boxes').hasClass('ativo')) {
                        $('#conteudo .boxes').removeClass('ativo');
                        $('.boxAberto').animate({width:'0'},600, function(){
                            console.log('sad')
                        });
                    } else {
                        this.iid = setInterval(function() {
                            if (cont > -565) {
                                cont -= 5;
                                $('#conteudo').attr('style','left:'+cont+'px'); 
                                console.log(cont)
                            }
                            if (cont <= -565){
                                $('#linkNext').hide();
                            }       
                        }, 0);
                    }
                },
                mouseleave: function(){
                    this.iid && clearInterval(this.iid);
                }
            });

如果用户单击 a .boxes，它将添加一个类.ativo和.animate({width:X},600)单击的 div。

问题是，当我悬停任何链接时，如果.boxes有一个类“.ativo”，它应该关闭该框，width:0并且我放置一个回调函数以继续.animate()向左或向右。但它只会关闭盒子。我必须做一个鼠标离开并悬停它继续.animate向右或向左。

有人能帮我吗？

PS：我刚才提到的功能#linkNext，#linkPrev功能是工作。只是为了防止大文本。

4

0 回答 0