• 締切済み

メニューバーが特定のページで動作が止まります

みなさまこんにちは。 下記のURLを参考にjQueryを使ったナビゲーションメニューを設置しました。 http://tympanus.net/codrops/2010/01/17/css-and-jquery-tutorial-fancy-apple-style-icon-slide-out-navigation/ トップページをはじめとしてほとんどのページで正常に動作するのですが、 商品詳細ページでのみ、動作しません。 正常動作時は、ページの読み込み直後はすべてのアイコンが展開された状態で表示され、 一呼吸置いてメニューバーの下に格納されます。 商品詳細ページでは、アイコンが展開された状態で表示されたまま、 待ってもメニューバーの下に格納されません。 見よう見まねで設置しているため、原因を究明できず困っています。 何から試して原因を探ればよいでしょうか? よろしくお願いいたします。

  • zhy_a
  • お礼率36% (21/57)

みんなの回答

  • wpwpwpw
  • ベストアンサー率38% (57/148)
回答No.1

ソースを見てみました。 サンプルのindex.htmlの下部(63行目~)に記されている以下の部分は存在しますか? <script type="text/javascript" src="jquery-1.3.2.js"></script> <script type="text/javascript"> $(function() { var d=1000; $('#menu span').each(function(){ $(this).stop().animate({ 'top':'-17px' },d+=250); }); $('#menu > li').hover( function () { var $this = $(this); $('a',$this).addClass('hover'); $('span',$this).stop().animate({'top':'40px'},300).css({'zIndex':'10'}); }, function () { var $this = $(this); $('a',$this).removeClass('hover'); $('span',$this).stop().animate({'top':'-17px'},800).css({'zIndex':'-1'}); } ); }); </script> 無ければ追記してください。 あと、階層が変わればjquery-1.3.2.jsへのパスも変わりますのでご注意ください。 <script type="text/javascript" src="jquery-1.3.2.js"></script> ↓こんな感じで・・・ <script type="text/javascript" src="../jquery-1.3.2.js"></script>

zhy_a
質問者

補足

ありがとうございます! 確認しましたが、ご指摘部分のコードは適切に含まれていました。 jquery-1.3.2.jsは、絶対リンクで記述していましたので、階層の影響を受けていませんでした。 ありがとうございました。また他に確認するところがありましたら、教えて頂けますと助かります。

関連するQ&A

  • wordpressで特定のページのみメニュー表示したい

    wordpressでホームページを制作しております。 作成したページをメニューに表示/非表示を切り替えたいと思っています。 「会社概要」「問い合わせ」などのページは、ナビゲーションメニューとして全ページに設置したいのですが、表示したくないページもあります。 制御する方法があれば教えてください。

  • 別ページからのアンカーリンクについて

    現在、下記jqueryを使用して横スクロールサイトを制作中です。 http://tympanus.net/codrops/2010/06/02/smooth-vertical-or-horizontal-page-scrolling-with-jquery/ 上記サイトを参考に 設置し問題なく動作しているのですが、 アンカーリンクを使用して 別ページから、各コンテンツにジャンプさせたいと思っています。 設置しているナビゲーションメニューからだと スムーズにスクロールし、正常に動作(コンテンツが一番左の位置でストップ)するのですが、 別ページから ○○.html#アンカーリンク名 というふうに リンクを張ると、表示位置が一番左の位置ではなく スクロールの途中でずれて止まってしまいます。 CSSも含め色々といじってはみたのですが まったく原因がつかめず苦戦しております。。 以下のスクリプトでは、ナビゲーションのリンクをクリックすると 動作するようにしていますが、 アンカーリンク名が○○の場合は、○○に表示させる といった命令のようなことはできるのでしょうか? 知識不足で申し訳御座いませんが お分かりの方がおられましたら宜しくお願いいたします。 $(function() { $('ul.nav a').bind('click',function(event){ var $anchor = $(this); /* if you want to use one of the easing effects: $('html, body').stop().animate({ scrollLeft: $($anchor.attr('href')).offset().left }, 1500,'easeInOutExpo'); */ $('html, body').stop().animate({ scrollLeft: $($anchor.attr('href')).offset().left }, 1000); }); });

  • firefoxのメニューバーに追加

    firefoxでメニューバーに(ナビゲーションツールバーの方ではありません) プロファイルのショーカットを追加したいのですが、テキストだけのボタンを 追加する方法は無いでしょうか? toolbar buttonsのアドオンで、メニューバーに追加すると、 アイコンの表示だけブラウスの面積を圧迫してしまいます。 しかし、ナビゲーションバーにはアイコンとテキストを両方表示させてる状態 なので、「テキストのみ」の表示にすることはしたくありません。 私が調べた限りでは分かりませんが、スタイルシートなど、メニューバーに テキストだけのボタンを追加することはできますでしょうか?

  • メニューバーのカスタマイズ

    javascriptについて教えてください。 いわゆる 折りたたみ型?のメニューバーを作成したく、 サンプルコードを入手したのですが知識が薄いため、進める事ができておりません。。 このページの内容です。slide in slide out でメニューバーを表示/非表示にしています。 http://demos.mootools.net/Fx.Slide 下のhorizon型の折りたたみ時に、以下の状態を作成したいのです。 1.メニューが少し見えるようにする(非表示は嫌なのです) 2.それに触れる(クリックでもOK)とバーが横展開する uniqlockのイメージに近いですね。 なんとか、ご指導いただけないでしょうか。 よろしくお願い致します。

  • jqueryについて分からなくて困っています。

    jqueryを使って常にナビゲーションがついてくるフローティングメニューを設置しようと思っているのですが、ナビゲーションが全然動きません。 又、ナビゲーションにページ内リンクを設置しているのですがfirefoxだとリンク先に飛びません。 初歩的な事かもしれませんがjqueryを使った事がなくどうしていいのか困っています。 何が原因なのでしょうか? どうかお力をかして頂ければと思っております。 ↓下記のURLの内容になります。 http://www.roid-company.com/test/index.html

  • プルダウンメニューについて

    知人から頼まれホームページを作成しています。 javascriptでプルダウンメニューと打ち出し画像の両方を使うとうまく表示されません。 グローバルナビゲーション(プルダウンメニュー)のすぐ下に打ち出し画像がくるレイアウトになります。 打ち出し画像が邪魔をしてプルダウンのサブメニューが表示されません。 【プルダウンメニュー】 http://www.kriesi.at/wp-content/extra_data/suckerfish_tutorial/step4.html 【打ち出し画像】 http://jonraasch.com/blog/a-simple-jquery-slideshow 上記の2つを組み合わせ、プルダウンの伸びたメニューが打ち出し画像に重なり、動かすことは可能でしょうか? HTMLとCSSの知識はありますが、プログラムの知識はありません。 よろしくお願いします。

  • Firefoxメニューバーからアクロバットが消えた

     ファイヤーフォックスはVer3.6.9を使っています。AcrobatはX Standardの10.1.4です。  Firefoxのツールバーのうちのメニューバー(戻る、進む、などの表示があるところ)に、以前はアクロバットのアイテム(アイコン)がありました。ここをクリックするとWebページがPDFに簡単になりました。それが消えてしまい大変困っています。  ちなみにそのアイテムは、アクロバットのツールバーに示されているアイテム(アイコン)と同じものです。なおメニューバーのアイテムが消えている状態でも、アクロバットのツールバーは表示されています。  アクロバットのツールバーは、アイテムが1つであるにもかかわらず、1行分の画面を占領してしまうため、Webページの表示がせまくなり、私にとっての使い勝手が非常に悪いのです。  そこで以下のことを行いましたが、表示できません。  まず第一に、ツールバーのカスタマイズで、アクロバットのアイテム(アイコン)を探しましたがありません。  次に、アクロバットのツールバーからアイテム(アイコン)をメニューバーに移動させようと思いましたが、できません。  その次に、Acrobat Xの環境設定を探しましたが、残念ながら、再表示させる設定が見つかりません。  どなたかお教えいただけませんでしょうか。  よろしくお願いします。

  • アコーディオンメニュー

    下記のサイトのようなナビゲーションをつくりたいと考えています。 http://www.art-shinbi.com/ (メインのメニューにロールオーバーすると、サブメニューが透明度を持って表示される) 他に参考になりそうなサイトや、解説ページ、jQueryプラグイン?などがあれば教えてください。

  • Dreamweaverのメニューが乱れる

    Dreamweaver CS3を使ってウェブホスティングしています。 Spryを使ったナビゲーションメニューをテンプレートにして50ページほどのサイトになっています。 自分で悪さをした結果でしょうが、あるとき、左側に縦置きにしているナビゲーションメニュー(子・孫格納したもの)がずらーっと縦置き一覧表示になって全頁のタイトルが一列表示されるようになってしまいました。 全タイトルにはリンクがついているのでナビゲーションからページを選ぶことは可能ですが超縦長ページになってしまい、みっともないです。 テンプレートをDWで見る限りでは異常はありませんが、テンプレートから作成したページはオフラインでも狂っています。 過去にも何回かあったのですが、わけのわからないままにいじくっていたら治っていました。  お知恵を拝借いたしたく、ご教示ください。

  • このメニューボタンをクリックして、このページを見てますよー、という意味の動作

    お世話になります。 ビルダー11で作成しております。 フレーム2分割のページ(ターゲットA,ターゲットB)があります。 ターゲットAに、各メニューアイコンが並べてあり、 マウスオーバー/アウト時に、画像が変化するようになっています。 メニューアイコンをクリックすると、ターゲットBの画面が変わる …と、ここまではいいのですが、その際、ポインタを動かすと、 マウスアウト時イベントが反応して、アイコン画像が元に戻ってしまいます。 ここで、アイコン画像を元に戻さないようにしたいのですが、 どのようにしたらよいでしょうか? ※他のメニューアイコンがクリックされたときは、今のままの動作でOK。 分かりにくいかもしれませんが、どうぞよろしくお願いいたします。 (これがわかれば、晴れてサイトが完成です。><)

専門家に質問してみよう