我做了一個懸停與粘性點擊'jquery腳本爲我的網絡投資組合,在Chrome,Opera,Firefox和Safari的作品 - 但我仍然有一些問題與IE瀏覽器。jQuery懸停w粘性點擊/選擇問題在IE瀏覽器
我有8個縮略圖可以在懸停時在0.3和1之間褪色。點擊後,它使用縮略圖的索引顯示相應的全尺寸圖像。它還與一組數字相關聯,1-8也可以在懸停時從0.3到1不透明度消失。
最不清楚的部分是應用懸停的選擇。這是按類應用於縮略圖/數字的,並使用可見圖像的索引來過濾掉「點擊」的拇指/數字,以使其保持完全不透明狀態,而不管懸停。
使用IE這個'sticky click'不起作用,所有的元素都會恢復到懸停行爲。我哪裏錯了? (我不需要它的工作回到IE6或什麼,但我想至少獲得當前IE才能正常工作。)
<script type="text/javascript">
$(function() {
$(".gall").hide();
$(".gall:first-child").show();
var thumbs = $(".thumb2,.thumb")
thumbs.fadeTo(0,0.3);
$(".thumb2:first-child,.thumb:first-child").fadeTo(0,1);
var notselected= $(".gall:visible").index();
$(".thumb:not(#selected),.thumb2:not(#selected2)").hover(function (evt) {$(this).fadeTo(0,1);}, function (evt) {
$(".thumb:gt("+notselected+"),.thumb2:gt("+notselected+"),.thumb:lt("+notselected+"),.thumb2:lt("+notselected+")").fadeTo(0,0.3);
notselected.hover(function (evt) {notselected.fadeTo(0,1);},function (evt) {notselected.fadeTo(0,0.3);});
});
thumbs.click(function() {
var thumbindex1 = $(".thumb").index(this)
var thumbindex2 = $(".thumb2").index(this)
if (thumbindex1>thumbindex2) {var indexboth = thumbindex1}
else {var indexboth = thumbindex2}
var clicked = $(".thumb:eq("+indexboth+"),.thumb2:eq("+indexboth+")")
var notclicked = $(".thumb:gt("+indexboth+"),.thumb2:gt("+indexboth+"),.thumb:lt("+indexboth+"),.thumb2:lt("+indexboth+")")
$("#tryme").html("A " +(indexboth+1)+ " was clicked <br> B "+(indexboth+1)+ " was clicked");
clicked.fadeTo(0,1);
notclicked.fadeTo(0,0.3);
$(".gall").hide();
$(".gall:eq("+indexboth+")").show();
});
});
相關的HTML很簡單:
有容器: DIV類=「包含」 持有一個DIV類=「庫」, 主圖像內,每個IMG類=「癭」 /DIV - 庫 -
有一個DIV class =「thumbcon tainer2" ,其中包含在一個單獨的DIV類=數1-8的每個‘的Thumb2’
有一個DIV類=‘thumbcontainer’,其中包含縮略圖每1-8在一個IMG類=‘拇指’
/DIV - 包含 -
很抱歉,如果我的jQuery代碼是有點困惑,這是我第一次的jQuery/JavaScript的。我很興奮,現在它在所有其他提到的瀏覽器中效果很好。 任何人都可以看到我打破Internet Explorer的位置嗎?
在此先感謝您的幫助。 -DAN