マウスオーバーで私のタブを選択する次の 2 つの関数があります。最初の関数は左側用です。
$(function() {
var $items = $('#vtab>ul>li' || '#vtab2>ul>li');
$items.mouseover(function() {
$items.removeClass('selected');
$(this).addClass('selected');
var index = $items.index($(this));
$('#vtab>div' && '#vtab2>div').hide().eq(index).show();
}).eq(0).mouseover();
});
これは右側用です：
$(function() {
var $items = $('#vtab2>ul>li');
$items.mouseover(function() {
$items.removeClass('selected');
$(this).addClass('selected');
var index = $items.index($(this));
$('#vtab2>div').hide().eq(index).show();
}).eq(0).mouseover();
});
次に、ページをフェードインおよびフェードアウトする別の関数があります。
$(document).ready(function() { $("body").css("display", "none");
$("body").fadeIn(3000);
$("a.transition").click(function(event){
event.preventDefault();
linkLocation = this.href;
$("body").fadeOut(2000, redirectPage);
});
function redirectPage() {
window.location = linkLocation;
}
});
何らかの理由で、2 番目の関数はページがフェードインしている間だけ機能し、アニメーションが完了すると機能しなくなります。2 番目の機能は、両方の垂直リストを同時に表示できないほど画面を小さくした場合にも機能します。
これがなぜなのか誰か知っていますか？私はjQueryが初めてで、どこから始めればよいか本当にわかりません。