問題タブ [jquery-cycle]
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 Cycle プラグインを使用してコンテンツ (写真ではない) のスライドショーを作成する - 以下のコードを機能させるにはどうすればよいですか?
これは私のスライドショーの内容です:
そして、これは以下のカスタム ナビゲーションです。
明らかに、ナビゲーションのアンカー リンクを上の右のスライドに対応させたいと考えています。可能であれば、現在選択されているナビゲーションに「アクティブな」クラスを追加したいですか?
例として、Brightcove (http://www.brightcove.com/en/) は、スライドショーで私が達成しようとしていることを多かれ少なかれ行います。
ありがとう
jquery - jquery追加クラス
こんにちは。
画像ギャラリーを表示するためにjquery.cycleプラグインを使用しています..
このギャラリーにナビゲーションがあります。
ナビゲーションに現在表示されている画像のクラス(アクティブ)を追加する必要がありますか?
ポインターはありますか?
ありがとうございました
javascript - Jquery Cycle Pluginを使用してすべての遷移後に関数を実行する
側面に親指があるシンプルなスライドショーがあり、クリックすると黒いバーが適切な位置にスライドして「強調表示」されます。
現在、この効果はユーザーが手動で親指をクリックしたときにのみ発生するため、各スライドが遷移した後に自動的にアニメーション化することも必要です。
Cycle には After 属性があり、すべてのスライドの後に関数を実行できると思いますが、カウンターを作成したり、現在どのスライドの「番号」を取得したりするにはどうすればよいでしょうか? 黒いバーの位置を決定するために必要です。
ありがとう
jquery - jQuery サイクル プラグイン、現在のスライドのサムネイル/リンクにクラスを追加
現在、この jQuery Cycle Plugin を使用しています: http://jquery.malsup.com/cycle/
そして、私は次のコードを持っています:
現時点では、スライドショーとスタイルの両方で適切に機能します。ただし、jQuery を使用して、現在表示されているサムネイル リンク (「products-slideshow-thumbs」クラスにラップ) にクラスを追加しようとしています。
上記のコードにあるjQueryは、サムネイルリンクをクリックするとクラスを追加しますが、別のサムネイルリンクをクリックすると、両方のサムネイルリンクが「現在の」クラスを保持します。1 つのリンク (現在のリンク) だけが「現在の」クラスを保持するようにする方法はありますか?
どんな提案でも大歓迎です!読んでくれてありがとう。
jquery - jQuery エラー - 後: 関数
したがって、Cycle プラグインを使用して jQuery の取り組みを続けると、新しいエラーが発生します。
エラーは、私のjquery-1.3.2.min.jsファイルの274行目を示しています。このセクションは次のとおりです。
これは、ページで使用されているサイクル関数が原因であると想定しています。
このスクリプトは HTML の上にあります。
このスクリプトを別のページで利用することができましたが、コンテンツ管理システムから使用する動的反復と関係があるかどうか疑問に思っています。これは、ビジュアルにあるエントリの数に基づいて「.slideshow」div を作成します。編集者...?ブワッ
javascript - このjQueryCycle拡張機能のリファクタリングに役立ちます
私は誰かにjQueryCycleプラグインの拡張を手伝ってもらい、うまく機能しました(Levi Morrisonに感謝します!)。これは簡単なプロトタイプだったので、まだいくつかの癖があります。
上にスクロールすると奇妙な効果があり、正しく機能しません。もう1つは、メインコンテンツ画像にカーソルを合わせても一時停止しないことです。誰か助けてもらえますか?
javascript - jqueryサイクルスライドショー-カスタムアニメーションとともにスライドの前/次の進行(a la scrollHorz)を追加
カスタムアニメーションでjqueryサイクルプラグインを使用しています。うまくいっています!
ただし、インデックス番号に応じてスライドを右または左に進めたいと思います。つまり、スライド#3がアクティブなスライドであるときにユーザーがリンク1をクリックすると、アニメーションは右に移行しますが、リンク4がスライドをクリックすると、左に移動します。
私が探している機能は、scrollHorz/scrollVertトランジションと同じです。
必要なのは、現在のフレームと次のフレームを関連付けるロジックであることを理解しています。if(frameclicked onは現在のスライドよりも高いインデックスです){左にアニメーション化}else{右にアニメーション化}
コードのどこに配置すればよいかわかりません。それが理にかなっていることを願っています。どんな助けでも大歓迎です!ありがとう!
おそらく役立つというわけではありませんが、私のカスタムコードは以下のとおりです。
jquery - jQueryサイクルが要素の高さを調整しているようです
malsupの素晴らしいjQueryサイクルが実行されているページがあります。最新バージョン(2.99)とSafari5.0.5を使用しています。私はこれまで次の問題に遭遇したことがなく、少し奇妙に思えます。
問題
ページが読み込まれるとき、.slides
要素の幅は654ピクセルしかない場合があります。cssファイルで960pxに設定しています。しかし、JavaScriptを使用して.slides
要素の幅を取得すると、1271pxの幅であると表示されます。は?この問題はFirefox(3.6.16)でも時折発生しますが、Safariほどではありません。奇妙なことに、IE8でこのエラーを再現できないようです。
私のコードはすべてW3Cで有効です(border-radiusへの3回の呼び出しを除く)。おそらく、フォーム要素をサイクルコンテナとして使用することに制限がありますか?Safariの誤動作ですか?
JS:
CSS:
ここで(うまくいけば)実際の「バグ」を見ることができます。これが他の人に起こっていないかどうか知りたいです(F5を数回押す必要があるかもしれません)。
この厄介な小さなバグを修正したいと思います。サイクル後にコンテナの幅を設定する回避策(間違いなく間違った幅に)は、問題の半分しか修正しません。次のスライドに移動すると、幅が半分になります。次のスライド、それは再びそれを半分にします。したがって、スライド3の後、すべてのコンテンツを240px幅までスクイーズします。
これに対する解決策は、すべての人にFirefox / IEの使用を強制することだと思います(会社のイントラネットに常駐します)。
事前に助けと洞察をありがとう!
ダン
更新されたリンクを編集します: https ://necms.com.au/cycle_oddities.php
jquery - サイクルライトが動き始めるとポジショニングが台無しになります
編集:どういうわけか、私はこれを2日間いじった後、ここに投稿した直後にそれを理解することを知っていました。将来の参考のために、自動車は高さと幅のために何らかの理由で機能しないようです。サイクルプラグインで手動で定義し、異なるサイズの画像を使用している場合は、ファインダー機能を使用して最大値を見つけます。これはうまくいくようですが、誰かが「自動」を元に戻すための解決策を持っているなら、私はそれが大好きです。これでスペースを無駄にしてすみません!
作業サイクルコード:
これは私が他の人が抱えている問題であり、私は以前に一度抱えていた問題であり、解決しました。残念ながら、以前は機能していたように見える「修正」を使用した後でも、元に戻りました(絶対位置と左または右にフロートします)。ページの読み込みが開始されると、想定どおりに画像の横にテキストが表示されます。cycle-liteが起動するとすぐに、テキストはスライドショーの下に移動するため(z-indexが低いように見えます)、非表示になります。私がどのcssconfigを使用するかは問題ではないようですが、それが問題であるに違いないと思います。フルサイクルプラグインが機能すると聞きましたが、編集できるのはボディの一部のみであり、cycle-liteはヘッドに事前に含まれているものです。また、私は常にそれを書いているわけではないので、「これはいくつかのテキストです」に実際に変更を加えることはできません。これは図書館に入りますが、私はできます
私のコード: