問題タブ [bxslider]

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.

0 投票する
3 に答える
17075 参照

counter - bxSlider 現在のスライド数表示 / 総スライド数表示

getCurrentSlide / getSlideCount の形式でページネーションを使用して bxslider を構築したいと考えています。ここのようなもの。

私のhtmlコード:

JS コード:

getCurrentSlide / getSlideCount を使用する必要があると思いますが、例が見つかりませんでした。

何か助けていただければ幸いです。ありがとうございました!

0 投票する
3 に答える
6427 参照

javascript - bxSlider onAfterSlide コールバック

おはようございます :) ここで問題が発生しました。すでに 2 日間首が痛いのです。ページ上でスライドする画像に bxSlider を使用しており、onAfterSlide コールバックで独自の関数を呼び出しています。1つのことを除いて、すべてが正常に機能します。スライドをすばやく切り替えると、関数が 2 ~ 3 回呼び出されます (ページに 3 つの画像があります)。これは、予期しない結果を返すため良くありません。マークアップが変更されたため、bxSlider の最新バージョンを使用できません。onAfterSlide コールバックが呼び出されたときにアニメーションがまだ終了していないため、これが発生すると思います。これは私が bxSlider を呼び出す方法です:

そして、これは私の機能です:

どんな助けでも感謝します。ありがとう。

編集: を追加しようとしまし.stop()たが、役に立ちませんでした。

0 投票する
1 に答える
2160 参照

javascript - mouseleave で bxSlider を無効にするには?

mouseleave でプラグイン 'bxSlider' を無効にすることは可能ですか?

ご意見をお聞かせください...

0 投票する
1 に答える
4954 参照

jquery - BxSlider-最初と最後のスライドを取得

BxSliderを使用してスライダーを作成しています。一度に3枚のスライドを表示するように設定しました。正常に動作します。現在、スライドの現在数と総数を計算して、最初と最後のスライドを取得しようとしています。現在、私は合計10枚のスライドを持っています-そしてその数は変わる可能性があります-(一度に3枚表示される)ので、私の機能は動作しません。明らかに6つまたは9つのスライドがある場合に機能します。

最初のスライドと最後のスライドを取得することに興味があるのは、最後のリンクと右のリンクをそれぞれ非表示にするためです。ここで私のフィドルを参照してください。私の機能はこれです:

-しかし、lastslideが小数を取得すると、悪いことが起こり始めます。誰かがこれを解決する方法を思いついたのですか?bxSliderのドキュメントについては、最初のリンクを参照してください。

0 投票する
2 に答える
4931 参照

jquery - BxSlider のアニメーションなしで次のスライドに移動するには?

jQuery プラグインbxSliderを使用しています。

2 つのカスタム ボタンがありprevnextスライドを切り替えます。
ただし、アニメーションなしでスライドに移動する必要がある特定の状況があり、それを瞬時にしたいのです。

これを達成する方法はありますか?

0 投票する
1 に答える
10806 参照

bxslider - 動的にロードされたコンテンツに対して bxslider が正しく機能しない

アプリの 1 つに bxslider を使用する必要がありました。ajax を介して動的に読み込まれたコンテンツを使用して bxslider を実装しようとすると、いくつかの問題が発生します。

それは突然働きます。興味深いことに、開発ツールを開いたり、ウィンドウ サイズを変更したりして、ビュー ポートにわずかな変更があった場合、それが機能することがあります

誰かが以前にこの問題に直面したことがあり、回避策となる可能性があることを理解したい.

ありがとう

0 投票する
3 に答える
11737 参照

javascript - BxSliderのインストール

私はウェブサイトのデザインの完全な初心者であり、会社のためによりモダンなウェブサイトを作成しようとしています. 現在のものは魅力的ではありません (Greenlite.co.uk)。

ホームページ用の Flash バナーの作成に多くの時間を費やした後、Flash はおそらくかなり時代遅れで、すべてのプラットフォームから表示できないことに気づきました。これがBxSliderに出くわしたときで、本当に素晴らしいです!自分のサイトで機能させることができれば。

私は CoffeeCup Visual Site Designer を使用しており、次に「HTML の追加」ツールを使用しました。「HTML の挿入」ウィンドウに次のように配置しました。

bxslider.com に示されている指示にできる限り従いました。bxslider からパッケージをダウンロードし、ファイルを coffeecup に追加して、スクリプト内の場所をリンクしました。また、画像を CoffeeCup に追加し、その場所に書き込みました。

Web サイトをプレビューすると、3 つの画像がすべて一度に表示され、それぞれの下にマウス オーバー キャプションが表示されます。画像の横には箇条書きがあります。

私が達成しようとしているのは、自動開始、停止/開始コントロールの表示、およびキャプション付きの Bxslider です。

私は多くのバリエーションを試みましたが、私が示したスクリプトは私の最初の試みです。

動作する Bxslider に最も近いのは、古いバージョンの bxslider の Web サイトから見つけたコードをコピーすることです。これにより、ヘッダー付きの画像スライドショーが表示されました。自分の仕様に合わせてコードを編集しようとすると、振り出しに戻ることになります。

私は非常に明白な間違いを犯している可能性が高いことを完全に認識しています. しかし、訓練されていない目には、頭痛の種しかありません。どんな助けでも大歓迎です。

0 投票する
1 に答える
19906 参照

javascript - Bxslider ボーダーの問題

画像に合うように bxslider の境界線を適切に揃えようとしています。

bxslider をさまざまな設定で使用して、さまざまな画像を多数試しました。

オプション "Mode:'Fade" と "Captions:"True" を削除すると、Bxslider は実際に画像にフィットします。キャプションなしで生活できますが、実際にはフェードトランジションが必要です。

ここで私が何を意味するかを見ることができますhttp://www.dennysplace.co.uk/

これは動作中のjsfiddleでもありますhttp://jsfiddle.net/FLuRH/

次のようなコード

そしてCSSはこちら

0 投票する
2 に答える
1973 参照

javascript - bxsliderは停止しません

ナビゲーションメニューのリンクをクリックしても、スライダーが自動再生を停止しないという問題があります。次の方法でスライダーを起動します。

自動再生されて動作しますが、onclick関数または.click()jQueryを作成してスライダーを停止しようとすると、次のようになります。

それは一瞬何かをしてから再開するようです。スライダーを停止する必要がある理由は、アンカーリンクにjQueryウェイポイントを使用して水平方向にスムーズにスクロールし、パネルが1または2ピクセルずつ前後に移動し始め、ユーザーにとって非常に煩わしいためです。

どんな助けでもいただければ幸いです。

0 投票する
2 に答える
2705 参照

jquery - 無限ループ時に空のスペースを表示する bxslider

この方法でプロジェクトに bxslider を追加しました: jquery:

HTML 部分:

次のボタンをクリックすると、スライダー内で画像が 1 つずつ移動するのがわかります。スライダーのすべての画像が終了すると、最初の画像から再び回転を開始します。この場合、小さな「空の領域」が表示されます。その後、最初の画像。空のスペースが見えないように、スムーズなループが循環的に機能するようにします。

上記の問題のリンクは

http://neelamsharma.s3.amazonaws.com/simplehtml/testing/testing.html

誰かがこれの解決策を教えてもらえますか?

事前に助けてくれてありがとう!