2

http://touchslider.comのコードを使用

1.）「currentClass」（開始画像）をランダムに設定するにはどうすればよいですか？ロード時に画像のいずれかが表示されますか？

2.) 画像をクリックしてスクリプトを切り替えるにはどうすればよいですか?

より具体的には、クリック/スワイプできるナビゲーションリンクと画像があります画像をクリックすると、その画像にロックされ、ナビゲーションリンクとスワイプが無効になるように設定するにはどうすればよいですか??

編集：2番目のオプションが解決されました+

touchslider.com スクリプトの編集を回避することができ、透明な div を使用して、要求された 2 番目のオプションを可能にしました。

JS (本体内)

<script>
$(document).ready(function(){
var $content = $("#disablediv1").hide();
$(".lock").on("click", function(e){
$content.toggle();
});
});
</script>

HTML (折り返し画像)

<a class="lock" href="#"><img src="IMAGELINK"></img></a>

HTML (無効にするリンクの上に配置された透明な div)

<div id="disablediv1"></div>

CSS (透過 div 用)

#disablediv1{
position:absolute;
left:200px;
top:20px;
width:600px;
height:544px;
z-index:999;
}

^うまくいけば、誰かがそれを役に立つと思うでしょう.

*スライダーに最初の画像をランダムに表示させる方法をまだ探しています...

4

1 に答える 1

0

touchslider の例では、元の HTML と CSS を整理しました。 http://touchslider.com/

作業例。

http://jsfiddle.net/jvt7U/1/

これは、効率のために画像プリローダーのように機能します。画像 src は HTML から除外され、ギャラリーという名前の画像用の配列が存在します。

2 つのループがあります。最初のループは、配列構造のランダムな順序を設定します。例えば：

2,0,1
1,2,0
0,1,2

2 番目のループは、ギャラリー配列からの画像パスに基づいて、画像の場所を割り当てます。

ランダムジェネレーター。

より良い乱数ジェネレーターを検索して、ここのコードを置き換えるだけです。

// Randomize the Array
galleryPosition.sort(function() {return 0.5 - Math.random()});
于 2013-07-21T17:53:48.440 に答える