Team:Nanjing NFLS/testtest

From 2014hs.igem.org

(Difference between revisions)
 
(One intermediate revision not shown)
Line 69: Line 69:
});
});
       /*自动切换*/
       /*自动切换*/
-
+
$(".slider-scroll").hover(function(){
 +
              clearInterval($picTimer);
 +
              },function(){
 +
                  $picTimer = setInterval(function() {
 +
  if(index==$len-1)
 +
            {
 +
        index=0;
 +
            }
 +
else
 +
{
 +
    index+=1;
 +
}
 +
                      $("#"+$objId).find("ul li").removeClass("on");
 +
        $("#"+$objId).find("ul li").eq(index).addClass("on");
 +
$("#"+$showArea).find("img").css({"display":"none","opacity":"0.3"});
 +
$("#"+$showArea).find("img").eq(index).css({"display":"block"}).stop(true,false).animate({"opacity":"1"},500);
 +
                  },opts.interval); // 自动播放的间隔,单位:毫秒
 +
          }).trigger("mouseleave");
 +
function showimg(index)
 +
{
 +
if(index==$len)
 +
    {
 +
  index=0;
 +
    }
 +
  $("#"+$objId).find("ul li").removeClass("on");
 +
  $("#"+$objId).find("ul li").eq(index).addClass("on");
 +
  $("#"+$showArea).find("img").css({"display":"none","opacity":"0.3"});
 +
  $("#"+$showArea).find("img").eq(index).css({"display":"block"}).stop(true,false).animate({"opacity":"1"},500);
 +
  index+=1;
 +
}
 +
}
});
});
</script>
</script>
Line 91: Line 121:
<div  class="slider-scroll f-c">
<div  class="slider-scroll f-c">
<div id="showArea">
<div id="showArea">
-
<a  target="_blank"><img style="display:block; opacity:1;" src="https://static.igem.org/mediawiki/2014hs/4/42/NFLSYQFNEWNEW.png" width="664px" height="419px"><p style="display:block; opacity:1;">XYM loves XYM</p></a>
+
<a  target="_blank"><div style="display:block; opacity:1;">XYM loves XYM</div></a>
<a  target="_blank"><img style="display:block; opacity:1;" src="https://static.igem.org/mediawiki/2014hs/1/12/NFLS_Wzn-done.png" width="664px" height="419px"></a>
<a  target="_blank"><img style="display:block; opacity:1;" src="https://static.igem.org/mediawiki/2014hs/1/12/NFLS_Wzn-done.png" width="664px" height="419px"></a>
<a  target="_blank"><img style="display:block; opacity:1;" src="https://static.igem.org/mediawiki/2014hs/f/fc/NFLSLYF%281%29.png" width="664px" height="419px"></a>
<a  target="_blank"><img style="display:block; opacity:1;" src="https://static.igem.org/mediawiki/2014hs/f/fc/NFLSLYF%281%29.png" width="664px" height="419px"></a>

Latest revision as of 02:21, 20 June 2014

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 响应式图片切换jQuery选项卡