3

filter.js という Jquery 画像スライダー プラグインがあります。ここでデモを参照してください。問題は、ページを最初にロードするときに、すべての画像が表示されることです。最初の読み込み時に、最初のタブ/div の画像のみを表示したいのですが、次の div/タブをクリックすると、その相対画像が表示されます。次に追加したのは、最初のタブ/div に属していないすべての画像の可視性を非表示に設定することです。関数がアクティブになると、非表示の可視性を他のタブ/div の画像に表示されるように復元します。

CSS:

.tancan{  /*Note: tancan is the class of the second div I initially want to hide*/
    visibility: hidden;
}​

JS:

$(function(){
        $('.filters.demo1').filters();
        $('.tancan').style.visibility = "visible";
    });​

私の問題：可視性を非表示に設定すると、このようにしてもうまくいきません。

$('.tancan').style.visibility = "visible";

コマンドが機能しない - 画像は非表示のままです。display: none; を使ってみました。および表示: ブロックしますが、醜いトランジションを作成します...ページの読み込み時に最初のタブの画像のみを表示し、すべての画像を表示するにはどうすればよいですか?

私のJSFIDDLEを見てください

ありがとうございました

4

2 に答える 2

3

これは私にはハックのように思えますが、うまくいきます：

$('.filters.demo1').filters();
$('a[rel=koebana]').click();

http://jsfiddle.net/YapAU/21/

ところで、CSS の最後の部分を取り出しました。

于 2012-08-15T19:35:12.033 に答える
2

これを試して：

JS:

$(function(){
    $('.filters.demo1').filters();
    $("#tancan").click(function(){             
    $(".tancan").css("visibility", "visible");
    });            
});

</p>

HTML:

<div id="content">
    <div class="galleryTitle">Photo Gallery</div>    
    <div class="filters demo1">
        <div class="filter">
            <a href="#" rel="koebana">Koebana Spray Tan</a>
            <a href="#" rel="tancan" id="tancan">Vertical Sunbed (TanCan)</a>
        </div>
etc..

フィドル: http://jsfiddle.net/YapAU/19/

于 2012-08-15T19:19:30.593 に答える