- 締切済み
bootstrap3 タブ切替え内でのjquery
kosukejlampnetの回答
- kosukejlampnet
- ベストアンサー率44% (126/282)
https://teratail.com/questions/17841 同一人物？？？ もし同一の人物であるなら、こちらの投稿をそのまま放置するのはやめましょう。
関連するQ&A
- jqueryのタブ切り替えについて
jqueryのタブ切り替えについて jquery初心者です。 某ポータルサイトを運営していて、 今回jqueryを使ってタブ切り替えを作りたいと思っています。 http://www.samuraitype2.com/demo/20090306/index.html こんな感じのものです。 ホットペッパービューティーのようにタブを押して切り替えたいのですが、（←おそらくPHP） PHPがよくわからないもので、、 そこで、質問ですが 上のURLのサンプルは少量のテキストのみでしたが、 お店の写真数枚やgoogle map、FLASH動画などの内容で切り替えを行ってく上で 動作に重たさは出るのでしょうか？ ぱっ、ぱっ、と切り替わらず、少々読み込みがかかってしまうのでしょうか？ 教えて下さい。 そもそもjquery自体よくわかってはいないのですが、Javascript？ jqueryで色々種類があるんで、どういう意味なんでしょうか？ 宜しくお願い致します。
- ベストアンサー
- JavaScript
- タブ切替えメニューの懸念点について教えてくだい
いつもお世話になっています。 ＷＥＢサイトのリニューアルを計画しています。 予定では、以下のような遷移を考えており、コンテンツ2、もしくは、コンテンツ3に 最終の情報が入ります。 トップメニュー ＞ コンテンツ1 ＞ コンテンツ2 ( ＞ コンテンツ3 ) コンテンツ1、コンテンツ2は、1ページあたりの情報量が多く、長いページになる 予定なので、以下のサイトのようなタブ切替メニューを利用しようと考えています。 http://archiva.jp/web/javascript/tab-menu.html カテゴリ1 と カテゴリ2 両方のページでタブ切替えメニューを使った場合、 ユーザービリティの面やその他の面で懸念することがあれば ご教示いただきたいです。
- ベストアンサー
- CSS
- タブ切り替えが出来るjavascriptを使用しています。
タブ切り替えが出来るjavascriptを使用しています。 http://5am.jp/jquery/jquery_ui_tabs/ ここのサイトを参考にしてタブ切り替えが動くところまで行きましたが、 どうにかして、別ページからリンクをクリックした時に、特定のタブへ直接飛ぶようにしたいと思っています。 <script type="text/javascript"> $(function() { $('#ui-tab > ul').tabs({ fx: { opacity: 'toggle', duration: 'fast' } }); }); </script> ヘッダーにある上記のjavascriptを少し編集すればできそうな気がするのですが、 もうお手上げになっちゃいました。 申し訳ないのですが、どなたか教えていただければと思います。 よろしくお願いします。
- ベストアンサー
- JavaScript
- jQueryでタブ、スライダーを使う際の質問です
こんにちは。WEBデザインを勉強している者です。 本やネットを見ながらWEBデザインの勉強をしていますが、まだわかっていない事が多く、どなたかお答えして頂けたら大変有り難いです。 jQueryを使って、タブ（２つ）の中にそれぞれ写真を動かすスライダーを作ったのですが、 ２つめのタブのスライダーが、写真が終わっても空白のページにどこまでも進んでしまいます。 ページネーションの数も、写真の数以上に表示されていて、何ページ目かわかるように 色が濃くなるはずが、何も変わりません。 ひとつめのタブも、ページネーションが一個飛ばしで表示されてしまいます。 初心者なのに、難しい作りにしたのがまずかったのかと反省しましたが、こういった 作りは不可能なのでしょうか？似た質問を見て、＄をjQueryに変えるものや、いろいろ試しましたがチンプンカンプンで全くできませんでした。涙 両方のスライダーを動かそうと思って、 <div id="carousel">と<ul id="carousel_base">のidをclassに変えてしまったのですがそれが原因でしょうか.. もしおわかりになる方がいらっしゃったら、助けて頂きたいです。 スライダーはhttp://black-flag.net/jquery/20110708-3310.htmlここのコードをそのまま使いました。 ２つとも動かす為に、$('#carousel')などの#部分を全てクラス$('.carousel')に変えてしまいました。javascriptの方も#から.に変えました。 ですが２つのスライダーがまとめて動いてしまっているような感じもします。 よくわからない質問で申し訳ありません。 下にあるコード部分がもうひとつあって、<div id="tab-2">にしているという感じです。 <div id="tab-1"> <div class="carousel"><!-------------carousel start-----------------------> ↑ここはもともとidでした <ul class="carousel_base"><!-------carsousel_base start-------> ↑ここはもともとidでした <li> <ul> <li><img src="#" /></li> </ul> </li> <li> <ul> <li><a href="#" rel="lightbox[roadtrip]"><img src="#" /></a></li> <li><a href="#" rel="lightbox[roadtrip]"><img src="#" /></a></li> </ul> </li> <li> <ul> <li><a href="#" rel="lightbox[roadtrip]"><img src="#" /></a></li> <li><a href="#" rel="lightbox[roadtrip]"><img src="#" /></a></li> </ul> </li> <li> <ul> <li><a href="#" rel="lightbox[roadtrip]"><img src="#" /></a></li> <li><a href="#" rel="lightbox[roadtrip]"><img src="#" /></a></li> </ul> </li> <li> <ul> <li><img src="#" /></a></li> </ul> </li> </ul><!-------carsousel_base end--------> </div><!-----------------------carousel end-----------------------------> </div><!--tab-1 end-->
- ベストアンサー
- JavaScript
- jQueryにて複数ライブラリを動かす
wordpressにてWEB制作を行っています。 jQueryにてfullpage.jsというフルページスクロールするライブラリを使用しております。 そのセクションの一つをfullpage.jsの機能の一つ横スライドを行っているのですが、 fullpage.jsのオプションには自動再生はありません。 スライド部分のみ自動再生を行いたいので bxslider.jsというライブラリを使用し、 横スライドしたいセクションをbxsliderで動かしたいのですが、 bxsliderが全く作動しません。 また <script type="text/javascript"> jQuery(document).ready(function(){ jQuery('.bxslider').bxSlider(); }); </script> の記述を <script type="text/javascript"> jQuery(document).ready(function() { jQuery('#fullpage').fullpage(); }); の上に書くと今度はfullpageが動きません。 jQueryライブラリは同ページで二つ同時には動かないんでしょうか？ また、書き方が間違っていますでしょうか？ 宜しくお願い致します。
- 締切済み
- JavaScript
- タブの切り替えについて
こちら（http://5am.jp/jquery/jquery_ui_tabs/）のサイトを参考に JSはそのまま使用し、CSSのみ少し手を加えて、タブの切り替えを作成したのですが、 タブを切り替える度にページトップへスクロールしてしまいます。 JSに手を加えてこれを回避する方法はあるのでしょうか？
- 締切済み
- JavaScript
- タブ切替
下記サンプルを使ってタブ切替のページを作成したのですが、 タブだけでなく、ページ内に「次へ」「戻る」ボタンを追加する方法を教えてください。 ■タブ切替ページ http://archiva.jp/web/javascript/tab-menu.html ■追加内容 page1 最下部に「次へ」のボタンでpage2へ page2 最下部に「戻る」のボタンでpage1、「次へ」のボタンでpage3へ よろしくお願いいたします。
- ベストアンサー
- JavaScript
- タブ切り替え 複数同時を複数組 javascript
タブ切り替え 複数同時を複数組 javascript タブ切り替えのページを作りたいのですが ググっても複数同時に切り替えるものや複数組のものはあっても 複数同時を複数組切り替えるものはありません。 したいことは ｜タブ１｜タブ２｜タブ３｜ ｜コンテンツ1-1｜コンテンツ1-2｜コンテンツ1-3｜ ｜タブ４｜タブ５｜タブ６｜ ｜コンテンツ4-1｜コンテンツ4-2｜コンテンツ4-3｜ ｜タブ７｜タブ８｜タブ９｜ ｜コンテンツ7-1｜コンテンツ7-2｜コンテンツ7-3｜ ・ ・ ・ これが ｜タブ１｜タブ２｜タブ３｜←タブ２を押した場合 ｜コンテンツ2-1｜コンテンツ2-2｜コンテンツ2-3｜ ｜タブ４｜タブ５｜タブ６｜←タブ５を押した場合 ｜コンテンツ5-1｜コンテンツ5-2｜コンテンツ5-3｜ ｜タブ７｜タブ８｜タブ９｜ ｜コンテンツ7-1｜コンテンツ7-2｜コンテンツ7-3｜ ・ ・ ・ というのができません。 上のタブを操作すると 下のコンテンツが消えてしまい 下のタブを操作すると 上が消えたり また複数タブできた場合は 複数箇所同時はできませんでした。 javascript初心者の私にどなたかご教授を。 コンテンツそのものを消すやり方でもいいですが なるべくclassを変更で消す方法がいいです。 よろしくお願いします。
- ベストアンサー
- JavaScript
- jqueryでスライダーを設置した時に
jqueryでスライダーを設置した時に設置したページのテキストが画像がスライドするタイミングで点滅してしまうようです。 現象が起こっているのはMacのsafariとchromeです WindowsのIEやモダンブラウザ、MacのFirefoxではオッケーのようです。 ちなみにコンテンツスライダーは、glide.jsやbxslider.jsです。両方とも同じ現象が起きます。 chrome はwebkitではなくなりましたし、、、 該当ページでは、スティッキーヘッダ、トップへ戻るボタン、ロールオーバーや複数のタブパネルなど、jQueryの塊のようなページになっておりまして、、、 ただ、それらをすべて無効にして、スライダだけを実装状態にしても同じようです。 スライダーそれぞれのCSSをみてみましたが、同ページにあるCSSの他のセレクトと同名のセレクタはないようです、、、 どなたか似たような現象を解決された方がいらっしゃいましたらご教示願えますでしょうか？
- 締切済み
- JavaScript
- 複数のライブラリの使用について(jQuery)
現在jQueryを使って、タブメニュー(http://25egg.com/sample/tabmenu/)とスライダ(http://bxslider.com/)を併用したものを開発しようと思っています。 つまりタブメニューを複数用意し、そのタブメニューの中にスライダをおくかんじです。 そしていざ作ってみたら、一応タブの中にスライダがでてきて予想通りの挙動を確認することができました。 しかし、一番目のタブ(一番最初に選択されるタブ)にスライダを設置した場合のみに限られ、一番目ではなく二番目のタブにスライダを設置したら、中身が空で表示されてしまいます。 うまく伝える事ができないので、実際にサンプルを以下にまとめました。 http://web.sfc.keio.ac.jp/~t11881tm/sample.zip index.html中のコメントアウト(タブの追加)をはずすとうまくうまく動いてくれません! よろしくお願いします!
- 締切済み
- JavaScript
補足
まったく関係のない方の投稿ですが、逆に見れて良かったです 同時に諦めもつきました。。。