0

我需要有关我的 jQuery 脚本的帮助,img鼠标悬停和.conceptcontent显示类时的更改,鼠标离开时的img更改,但我可以隐藏.conceptcontent类吗?

(function ($) {
    $(".img-swap").hover(

        function () {
            this.src = this.src.replace("_off", "_on");
            $(".conceptcontent").show("slow");
        },

        function () {
            this.src = this.src.replace("_on", "_off");

        });

    var imgSwap = []; $(".img-swap").each(function () {
        imgUrl = this.src.replace("_off", "_on");
        imgSwap.push(imgUrl);
    });

    $(imgSwap).preload();
})(jQuery);

html

 <title>Untitled Document</title>

 </head>
 <body>
<!--background-->
<div id="intro">
<h1 id="rubrik">Josef Carlsson</h1>
</div>


<div class="meny">
<div id="home"><img src="iconer/home_off.svg" class="img-swap"></div> 
<div id="about"><img src="iconer/ommig_off.svg" class="img-swap"></div> 
<div id="design"><img src="iconer/design_off.svg" class="img-swap"></div> 
<div id="internet"><img src="iconer/internet_off.svg" class="img-swap"></div>
<div id="camera"><img src="iconer/kamera_off.svg" class="img-swap"></div>
<div id="concept"><img src="iconer/koncept_off.svg" class="img-swap"></div> 
 </div>

 <div class="menytext">
<div id="hometext">Start</div>
<div id="abouttext">About me</div>
<div id="designtext">Design</div>
<div id="internettext">Webb</div>
<div id="cameratext">Pictures</div>
<div id="concepttext">Concepts</div> 
 </div>

 <ul class="conceptcontent">
<li>emotion</li>
<li>[in]sight</li>
<li>will i make it</li>
<li>trace</li>
    <li>datemate</li>
    <li>pacman</li>
</ul>

这是使用的 html

4

3 回答 3

0

你不只需要像你有show()一样的隐藏吗?

编辑:我开始猜测动画正在排队。我尝试复制试试这个:

(function($){
$(".img-swap").hover(
function(){this.src = this.src.replace("_off","_on");
        $(".conceptcontent").stop(true.true).show("slow");},

function(){this.src = this.src.replace("_on","_off");
           $(".conceptcontent").stop(true,true).hide("slow");

 });

jQuery stop() 停止当前动画。

于 2013-04-10T19:51:23.920 回答
0

你可以用它来隐藏它

 $(".conceptcontent").hide('slow');
于 2013-04-10T19:51:37.433 回答
0

与您为鼠标悬停所做的相反的是:

...
$(".img-swap").hover(
  function(){
    this.src = this.src.replace("_off","_on");
    $(".conceptcontent").show("slow");
  },
  function(){
    this.src = this.src.replace("_on","_off");
    $(".conceptcontent").hide("slow");
  }
);
...

编辑: 我的打字速度比其他人慢......我想修复你的格式需要一两分钟;)

于 2013-04-10T19:54:08.980 回答