Ive сделал сценарий jquery с зависанием щелчком мыши для моего веб-портфолио, который работает в Chrome, Opera, Firefox и Safari, - но у меня все еще возникают проблемы с IE ,jQuery hover w липкий щелчок/проблемы с выбором в IE
У меня есть 8 эскизов, которые исчезают от 0,3 до 1 непрозрачности при наведении. При щелчке по нему используется индекс миниатюры для отображения соответствующего полноразмерного изображения. Он также связан с набором чисел, 1-8, которые также исчезают с 0,3 до 1 непрозрачности при наведении.
Наименее понятная часть - это выбор, для которого применяется зависание. Это применяется к эскизам/номерам по классам и использует индекс видимого изображения для фильтрации «щелкнутого» большого пальца/числа, чтобы он оставался на полной непрозрачности, независимо от наведения.
С IE этот «липкий щелчок» не работает, и все элементы возвращаются к поведению. Где я иду не так? (Я не нужно работать обратно в 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 прост:
Eсть контейнер: DIV класс = «содержит» которые держать класс DIV = «галерея», основные изображения находятся внутри, каждый класс IMG = «желчный» /DIV - гАЛЕРЕЯ -
есть DIV class = "thumbcon tainer2" , который содержит число 1-8, каждый в отдельный класс ДИВ = „Thumb2“
есть класс ДИВ = „thumbcontainer“, который содержит миниатюры 1-8 каждый в классе IMG = „пальца“
/DIV - СОДЕРЖАТЬ -
Извините, если мой JQuery код немного запутался, это мой первый JQuery/JavaScript. Я рад, что теперь он отлично работает во всех других браузерах. Может ли кто-нибудь увидеть, где я его нарушаю для Internet Explorer?
Заранее благодарим за любую помощь. -DAN