問題タブ [image-gallery]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
jquery - 複数の画像の JQUERY クリック イベント
JQUERY の入門知識を広げるための楽しみとして、画像ギャラリーを作成しています。ギャラリーにはたくさんのサムネイルがあり、クリックすると画像ビューアー div のすぐ下に大きな画像が表示されます。さらに、サムネイルがアクティブな場合 (画像が表示されている場合)、サムネイルは 75px から 100px にアニメーション化されます。
IDをすべての画像に接続し、それを各画像アンカーに渡すことで、手動で機能させました。以下の構造:
これは、すべてのサムネイルに対して繰り返されます。ユーザーがクリックすると、画像が読み込まれます
<div id="image_viewer"></div>
私の問題は、ギャラリーをできるだけ動的にしたいということです。すべてのサムネイルの ID を作成しなくても、ユーザーがクリックしたリンクを知る方法が必要です。
を使用してリンクの数を取得できます。これにより$(".thumb_link").length;
、サムネイル リンクの数がわかります。しかし、そのサムネイルに関連する画像を表示するために、どのサムネイルがクリックされているかをどのように判断できますか?
例: ユーザーが 3 番目のサムネイルをクリックすると、Thumb 3 の大きな画像が表示されます。
loadImage 関数:
次のように、各タグが割り当てられたクラスごとに画像をロードできるようにしたい:
この情報にアクセスするには、クリックの配列値を知る必要があります。
--
これを行う理由の 1 つは、特定のサムネイル属性 (画像の alt タイトル src など) を見つけて、別の場所にプラグインできるようにするためです。
どんな助けでも大歓迎です!
jquery - ギャラリーの画像をホバーでフェードさせて、タイトル、拡大、サイトへのアクセスなどの詳細を表示するにはどうすればよいですか?
最近、素敵な画像ギャラリーのホバー効果がよく使われているのを見てきましたが、そのような効果を再現する良い方法を誰かが知っているかどうか疑問に思っています。その効果は、画像にカーソルを合わせると、画像がフェードアウトするか、divがフェードインして画像上にリンクなどが表示されることです。
これは、ここにあるものと似ています: http: //cssnack.com/およびここ:http ://designsnack.com/
過去に似たようなものを作成しましたが、IEの不透明度のフェードに問題があったことを覚えています。どんなヒントも、同様の効果のための良いチュートリアルへの素晴らしい、あるいは方向性さえあります。
助けてくれてありがとう。
android - ギャラリー センターロック横スクロール
ギャラリー画像の中央固定水平スクロールを削除するにはどうすればよいですか?
jquery - HTMLギャラリーをスクロールすると、おそらく多くの画像が遅延ロード/アンロードする必要がありますか?
画像のd/bクエリの結果を、サムネイルのcoverflow-yタイプの水平スクロールギャラリー(長辺256ピクセル、各25kb)として表示するように依頼されました。ライブラリが必要な場合(おそらく)、jQueryを使用します。画像に加えて、ギャラリーにはキャプション(テキスト)データが表示される可能性があります。
問題は、ユーザーのクエリが無意識のうちに何千もの結果を引き出す可能性があることです。遅延読み込みは一方の側面を解決しますが、ユーザーがギャラリーアイテムをスクロールし続けると、最終的にブラウザがデータの量に苦労するようになり、遅延読み込みについてはほとんどわかりません。ギャラリーに10個のアイテムをロードさせ、最初の5個を表示してから、最大X個のアイテムをレイジーに追加する必要があると思います。その後、追加するアイテムごとに、最初のギャラリーアイテムを削除します。ユーザーが下にスクロールした場合、削除されたアイテムを遅延して再ロードする必要があります。
これは、表示コンテキストが少し異なっていても、他の人が以前に直面したはずの問題だと思います。上記を超える方法についてのポインタを歓迎します。また、WAN(Web)のコンテキストでは、見落としている他のパフォーマンスの問題がありますか(たとえば、ロードし続けるギャラリーアイテムの数)?
明確化(回答#1への回答)。
おそらく、「目立たない」アンロードの方が適切な用語かもしれません。これの核心は(jQueryコンテキストで)作成/破棄呼び出しをどのように/どこに配置するかです。
ギャラリー<ul>
が一度にN個のアイテムを表示するスクロール(おそらく水平ですが、垂直は許可されるべきだと思います)であると仮定し<li>
ます。クエリレコードセットのオフセット(ここではゼロベース)を使用してIDをシードできます。たとえば<li id="x_12">
、12はオフセット値です。これにより、コードは、作成/削除するオフセットとアイテムを知ることができます。また、開始時(オフセット0)の到着を検出することも可能になりますが、AJAXベースのロードには、次のアイテム(つまり、レコードセットの上限)がないことを示すメッセージメカニズムを組み込むことができます。
これの原則、私は得ます。しかし、より複雑なJavaScriptとAJAXにあまり詳しくないので、実際のコードの詳細について少し注意する必要があります。私の推測では、基本的な概念が機能すれば、既存のJQueryベースのギャラリーに追加できる可能性があります(そこで車輪の再発明をする意味はありません)。
php - codeigniterを使用した画像ギャラリー
サーバー上のフォルダーにいくつかの画像をアップロードし、それらのパスをデータベースのテーブルに保存しています。この画像をブラウザに(ギャラリーとして)表示するための最良の方法は何ですか?
jQueryを使用する必要がありますか、それともCodeIgniterで処理できますか?
jquery - クエリ内の別の div に関連テキストを含む画像ギャラリー
代替テキスト http://www.freeimagehosting.net/uploads/afde38dc9c.jpg
このような画像ギャラリーが必要です。画像数は動的です。左に移動すると、img-3 が中央の画像になり、img-3 のコンテンツが img-2content div に読み込まれます。これを行うにはスクリプトが必要です。前もって感謝します。
php - JSONファイルで「矢印キーを使用したスライド」を機能させるには?
ユーザーが左右の矢印を押すと、1 つの画像がスライドアウトし、新しい画像がスライドインする画像スライドギャラリーを作成しました。うまくいきました。
関連するすべての画像と説明は、私の PHP ファイルに含まれていました。今、新しい画像をいくつか用意したいと思っていますが、このコンテンツの追加と変更に必要以上に時間がかかっていることがわかりました。
そこで、すべての画像マークアップを削除して、画像用の JSON ファイルを用意することにしました。
データを取得してDOMに挿入するために使用しているコードは次のとおりです
準備完了のドキュメントの開始時に実行されますが、スライド矢印は機能しませんが、エラーは生成されません。
私の推測では、スライダーのコードと同時にコンテンツが作成されるためです。だから、彼らはお互いを見ることができません。
これを修正する方法はありますか (おそらく、スライダー コードが認識できるように getJSON を実行します)。
jquery - 画像を 3 つのサイズで表示する jQuery 画像ギャラリー プラグイン
jQuery 用の画像ギャラリー プラグインはたくさんありますが、画像を 3 つのサイズで表示できるプラグインが必要です。基本的な画像ギャラリー プラグインは通常、すべてのサムネイルと 1 つの大きな画像を表示します。サムネイルをクリックすると、選択した画像の拡大版が表示されます。この段階の後に何かが必要です。大きな画像をクリックすると、モーダルオーバーレイなどで、理想的には前/次のボタンで、さらに大きなバージョンの画像が開くはずです。このオプションは既存のプラグインで利用できると思いますが、見つけられないようです。
php - WordPress のギャラリー ショートコードでカスタム画像サイズを許可する
WordPress 2.5 以降では、WordPress ブログの投稿またはページに画像ギャラリーを追加するオプションを可能にするギャラリー機能が組み込まれています。(参照: http://codex.wordpress.org/Gallery_Shortcode )
オプションを使用してsize
、表示するサムネイルのサイズを指定できます。有効な値は、"thumbnail"、"medium"、"large"、および "full" です。デフォルトは「サムネイル」です。「サムネイル」、「中」、「大」の画像のサイズは、WordPress の管理パネルで設定できます。
すなわち。[gallery size="medium"]
私の質問: [gallery] ショートコードをハックして、入力時にカスタム サイズを許可しようとしています。管理パネルからこれを実行しようとはしていません。のようなものを使用したいと思い[gallery size="145x160"]
ます。
肥大化したプラグインをダウンロードするのではなく、既にあるプラグインで作業したいのですが、ファイル構造のどこに変更を加える必要があるのか わかりません。私は PHP に精通していますが、変更を加えると、WP の将来のバージョンを更新すると、設定した内容が上書きされるのではないかと心配しています。
誰かがこれで私を助けてくれますか?
どうもありがとうございました!
static - 最高の静的フォト ギャラリー ジェネレーター
静的 Web サイト ジェネレーターはたくさんありますが、それらのほとんどは (私の知る限り) テキスト指向のようです。最高の画像ギャラリー静的ウェブサイトジェネレーターは何ですか?
(注:この質問のより一般的な形式がすでに尋ねられていることを認識しています。この質問は、それ自体で十分に異なると思います。)