-1

onkeydown特定のサイトの画像ギャラリーを自動的に次の画像に移動するイベントを作成しようとしています。問題は、リンク構造が効率的に構成されていないことです。

したがって、基本的には、クリックして戻るまたは進む画像がページに存在するかどうかをユーザースクリプト内で見つけようとしています.ifステートメントを使用して、戻る/進むアクション（左矢印/右矢印のそれぞれのキーボード）は実際に行うことができます。

上記の画像がページに存在するかどうかを判断するにはどうすればよいですか?

4

3 に答える 3

0

jqueryを使用していると仮定すると、次のような単純なものです。

$('img[src="/path/to/left-arrow-picture.jpg"]')

するだろう、または彼らが彼らに特定のクラスを持っているなら、

$('img.prevclass')

動作します。プレーンなJavaScriptのみを使用している場合は、次のコマンドでこれをシミュレートできます。

var imgs = document.getElementsByTagName('img');
for(var i = 0; i < imgs.length; i++) {
   if (i.src == '/path/to/left-arrow-picture.jpg') {
       ...
   }
}
于 2012-09-24T04:29:36.363 に答える
0

通常、ギャラリーのすべての画像は配列で保持されるため、通常の動作はループすることです。そのため、最後の画像にあり、ユーザーが次の画像に移動したい場合は、ギャラリーが最初の画像に移動します。その逆も同様です。例えば

var currentImage = 0;
var numberOfImages = imageArray.length;

if ( <user wants next image> ) {
  currentImage = ++currentImage % numberOfImages;

} else if ( <user wants previous image> ) {
  currentImage = (--currentImage + numberOfImages) % numberOfImages; 
}

ギャラリーをどのように実装したかはわかりませんが、上記のロジックをなんとかして適用できるはずです。

注意深く、特定の値を持つ画像を探している場合はsrc、MarcBによって提案されているようにそれらをループします。の必要はないことに注意してください。すぐに使えるコレクションがgetElementsByTagNameあります。document.images

一部のブラウザではsrcプロパティがフルパスになりますが、他の（古い）ブラウザでは属性値のみであることに注意してください。実際の画像名と一致させる方がよいでしょう。

于 2012-09-24T04:42:16.623 に答える
0

まず、画像の CSS パスまたはsrc属性を決定します。(srcサイトがスプライトを使用している場合、存在しない可能性があります。または、一意ではない可能性があります。)

画像を右クリックしてInspect Elementを選択し、開発ツールまたは Firebug を使用してこれを判断できます。
セレクターの選択についてサポートが必要な場合は、ターゲット ページにリンクするか、適切な HTML スニペットを貼り付けます。

次に、次のようなコードを使用できます。

プレーンな JavaScript:

  • var lftArrwImg  = document.querySelector ("#galleryControls div.foo a img");
if (lftArrwImg) {
    // DO YOUR LEFT ARROW STUFF HERE.
}

    または：

    var lftArrwImg  = document.querySelector ("img[src='/some_path/left_arrow.gif']");
if (lftArrwImg) {
    // DO YOUR LEFT ARROW STUFF HERE.
}


jQuery:

  • if ( $("#galleryControls div.foo a img").length ) {
    // DO YOUR LEFT ARROW STUFF HERE.
}

    または：

    if ( $("img[src='/some_path/left_arrow.gif']").length ) {
    // DO YOUR LEFT ARROW STUFF HERE.
}

一部のサイトでは画像が常に表示されている場合がありますが、適用できない場合は非表示になっていることに注意してください。

于 2012-09-24T10:20:20.280 に答える