0

これが何をするかを説明するために>>各クリック機能は、ロゴカルーセル内の要素のクリックに反応し、カルーセルの外側に要素/ロゴが何であるかを説明するポップアップを作成します...

アイデアが浮かんだら、どうぞよろしくお願いします!!

HTMLとスクリプトが動作状態にあることを確認するには、@このリンクを一時的に>>

http://grayghostventures.com/x3.2/portfolio/portfolio3.html

すべてが言われ、完了する前に、いくつかのコードを強化しようとしているだけです！

jQuery(document).ready(function() {

var hideAll = "#hoverState1,#hoverState2,#hoverState3,#hoverState4,#hoverState5,#hoverState6,#hoverState7,#hoverState8,#hoverState9,#hoverState10,#hoverState11,#hoverState12,#hoverState13,#hoverState14,#hoverState15";

// Hover States for pop Ups


$("#logoPop1").click(function(){$(hideAll).fadeOut("slow");$("#hoverState1").fadeIn("slow");});
$("#logoPop2").click(function(){$(hideAll).fadeOut("slow");$("#hoverState2").fadeIn("slow");});
$("#logoPop3").click(function(){$(hideAll).fadeOut("slow");$("#hoverState3").fadeIn("slow");});
$("#logoPop4").click(function(){$(hideAll).fadeOut("slow");$("#hoverState4").fadeIn("slow");});
$("#logoPop5").click(function(){$(hideAll).fadeOut("slow");$("#hoverState5").fadeIn("slow");});
$("#logoPop6").click(function(){$(hideAll).fadeOut("slow");$("#hoverState6").fadeIn("slow");});
$("#logoPop7").click(function(){$(hideAll).fadeOut("slow");$("#hoverState7").fadeIn("slow");});
$("#logoPop8").click(function(){$(hideAll).fadeOut("slow");$("#hoverState8").fadeIn("slow");});
$("#logoPop9").click(function(){$(hideAll).fadeOut("slow");$("#hoverState9").fadeIn("slow");});
$("#logoPop10").click(function(){$(hideAll).fadeOut("slow");$("#hoverState10").fadeIn("slow");});
$("#logoPop11").click(function(){$(hideAll).fadeOut("slow");$("#hoverState11").fadeIn("slow");});
$("#logoPop12").click(function(){$(hideAll).fadeOut("slow");$("#hoverState12").fadeIn("slow");});
$("#logoPop13").click(function(){$(hideAll).fadeOut("slow");$("#hoverState13").fadeIn("slow");});
$("#logoPop14").click(function(){$(hideAll).fadeOut("slow");$("#hoverState14").fadeIn("slow");});
$("#logoPop15").click(function(){$(hideAll).fadeOut("slow");$("#hoverState15").fadeIn("slow");});

$(".closePop").click(function(){$(hideAll).fadeOut("slow");});


// JQuery End
});
4

1 に答える 1

2

Selectorで始まる属性を使用できます：

jQuery(document).ready(function ($) {
    var $hoverState = $("[id^=hoverState]");

    $("[id^=logoPop]").click(function() {
        var id = ( this.id.match(/\d+$/) || [] )[0];
        $hoverState.not('#hoverState' + id).fadeOut("slow")
        $hoverState.filter('#hoverState' + id).fadeIn("slow");
    });

    $('.closePop').click(function () {
        $hoverState.fadeOut("slow");
    });
});
于 2013-01-08T03:07:17.653 に答える