すみません、ホームページを作成していてIE9では、

問題なくリンクが開いていたのに、firefox20.0.1
ではリンクが動かなくなりました。
すみません、ご教示いただけないでしょうか。
Firefoxは通常のブラウザに設定はしてないです。
当方Windows7です。たぶん 的はずれもいいとこ
でしょうが、質問の補足にjavascriptの部分だけ
つけさせていただきます。よろしくお願いします。

回答の条件
  • 1人5回まで
  • 登録:
  • 終了:2013/05/09 17:54:02
※ 有料アンケート・ポイント付き質問機能は2023年2月28日に終了しました。
id:meichi

<script type='text/javascript' src='/js/lib/dummy.js'></script>

<link rel="stylesheet" type="text/css" href="/css/result-light.css">

<style type='text/css'></p> <p> </p> <p> </style>


<script type='text/javascript'>//<![CDATA[ </p> <p>window.onload = function(){</p> <p> var settings = {</p> <p> interval : 3000, // cubeを出す間隔</p> <p> dur : 30000, // cubeが持続する時間</p> <p> windowWidth : $(window).width(),</p> <p> windowHeight : $(window).height()</p> <p> }</p> <p> </p> <p> // cubeの最終スタイル設定</p> <p> var styleFor = {</p> <p> height : 48, // cubeの高さ ★サイズ変えました</p> <p> width : 48, // cubeの幅 ★サイズ変えました</p> <p> 'border-width' : 0 // cubeの罫線幅 ★縁取りを無くします</p> <p> }</p> <p> </p> <p> // cubeの初期スタイル設定</p> <p> var styleInit = {</p> <p> position:'absolute',</p> <p> 'z-index' : 5, // ★数値を大きくしました</p> <p> display : 'inline-block',</p> <p>// border : 'solid 4px #eaeaea', ★縁取りを無くします</p> <p> height : 24, // ★サイズ変えました</p> <p> width : 24, // ★サイズ変えました</p> <p> // ★クローバーの画像を使います(三行追加)</p> <p> 'background-image': 'url(file:///C:/hp/image6.gif)',</p> <p> 'background-size': 'contain',</p> <p> 'background-repeat': 'no-repeat',</p> <p> adj : 0</p> <p> }</p> <p> </p> <p> var cube = {</p> <p> init : function(){</p> <p> // ★z-index の値を大きくしました</p> <p> $('body')</p> <p> .wrapInner('<div style="position:relative;z-index:5"></div>')</p> <p> .append('<div style="position:fixed;top:0;left:0;z-index:5" id="cube-area"></div>');</p> <p> </p> <p> $('#cube-area').css({</p> <p> height : settings.windowHeight,</p> <p> width : settings.windowWidth</p> <p> });</p> <p> </p> <p> styleInit.adj = styleFor['border-width'] + styleFor['width'];</p> <p> },</p> <p> add : function(){</p> <p> var initX = cube.getRandomX();</p> <p> var initY = cube.getRandomY();</p> <p> </p> <p> var endX = cube.getRandomX();</p> <p> var endY = cube.getRandomY();</p> <p> </p> <p> styleFor.left = endX;</p> <p> styleFor.top = endY;</p> <p> </p> <p> $('#cube-area').append($('<div class="block" />')</p> <p> .css(styleInit) // end init</p> <p> .css({</p> <p> top : initY,</p> <p> left : initX,</p> <p> })</p> <p> .animate(styleFor,{</p> <p> easing : 'linear',</p> <p> duration : settings.dur,</p> <p> complete : function(){</p> <p> $(this).fadeOut(300,function(){</p> <p> $(this).remove();</p> <p> });</p> <p> }</p> <p> }</p> <p> )</p> <p> );</p> <p> },</p> <p> getRandomX : function(){</p> <p> return Math.floor( Math.random() * settings.windowWidth - styleInit.adj);</p> <p> },</p> <p> getRandomY : function(){</p> <p> return Math.floor( Math.random() * settings.windowHeight );</p> <p> }</p> <p> }</p> <br> <p> // execute</p> <p> cube.init();</p> <p> setInterval(function(){</p> <p> cube.add();</p> <p> },settings.interval);</p> <p>}</p> <p>//]]> </p> <p></script>


</head>

<body>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<script></p> <p>$(function() {</p> <p> $("#anchor").click(function() {</p> <p> var s = "<iframe name='display' class='display'></iframe>";</p> <p> $("#area").html(s);</p> <p> });</p> <p>});</p> <p></script>

ベストアンサー

id:a-kuma3 No.2

回答回数4974ベストアンサー獲得回数2154

ポイント120pt

左のABCのリンクが手のひら に変わらず リンクが動作
しないです・・・・

クローバーの画像を動かす処理を入れましたが、それの影響でした。

追加した javascript のコードを動かすと、元々見えていたテーブルの上にウィンドウ一杯のサイズのもう一枚の板を置き、その上にクローバーの画像を置くような処理になってました。
(見えてませんが)一枚被さっているので、下のリンクが押せないという...
# 何で、IE の方が押せるのかの方が不思議です

板を一枚被せている辺りの処理を修正すると、期待通りになると思います。
修正した辺りを抜粋したのが、こちらです。

        init : function(){
            // ★z-index の値を大きくしました
// ※※クローバーの画像を乗せる領域の構成を変えました
//          $('body')
//              .wrapInner('<div style="position:relative;z-index:5"></div>')
//              .append('<div style="position:fixed;top:0;left:0;z-index:5" id="cube-area"></div>');
            $('body')
                .wrapInner('<div id="cube-area" style="position:fixed;z-index:5"></div>');


サンプルも手直ししてます。
http://jsfiddle.net/a_kuma3/MbDTy/3/embedded/result/

# IE8 と FF20.0.1 では確認しました (^^ゞ

id:meichi

早いレス 大変 ありがとう ございます。m(_ _)m

動きました。(感謝!!)

・・・・それにしても 自分が14年前ホームページをつくっていたころと
    くらべて こんなに 変わってるなんて・・・・・

これで、質問を終了します。 ありがとう ございました。

2013/05/09 17:52:54

その他の回答1件)

id:Yacky No.1

回答回数1376ベストアンサー獲得回数156

ポイント30pt

推測で申し訳ないですが、それはページ内リンクの表記ではないでしょうか?
ページ内リンクでは以下の方法で動作すると思います。
http://www.xml.vc/hp/keitai/link-id1.html

<p><a href="#jump">移動元</a></p>

~途中略~

<h2 id="jump">ジャンプ先</h2>
id:a-kuma3 No.2

回答回数4974ベストアンサー獲得回数2154ここでベストアンサー

ポイント120pt

左のABCのリンクが手のひら に変わらず リンクが動作
しないです・・・・

クローバーの画像を動かす処理を入れましたが、それの影響でした。

追加した javascript のコードを動かすと、元々見えていたテーブルの上にウィンドウ一杯のサイズのもう一枚の板を置き、その上にクローバーの画像を置くような処理になってました。
(見えてませんが)一枚被さっているので、下のリンクが押せないという...
# 何で、IE の方が押せるのかの方が不思議です

板を一枚被せている辺りの処理を修正すると、期待通りになると思います。
修正した辺りを抜粋したのが、こちらです。

        init : function(){
            // ★z-index の値を大きくしました
// ※※クローバーの画像を乗せる領域の構成を変えました
//          $('body')
//              .wrapInner('<div style="position:relative;z-index:5"></div>')
//              .append('<div style="position:fixed;top:0;left:0;z-index:5" id="cube-area"></div>');
            $('body')
                .wrapInner('<div id="cube-area" style="position:fixed;z-index:5"></div>');


サンプルも手直ししてます。
http://jsfiddle.net/a_kuma3/MbDTy/3/embedded/result/

# IE8 と FF20.0.1 では確認しました (^^ゞ

id:meichi

早いレス 大変 ありがとう ございます。m(_ _)m

動きました。(感謝!!)

・・・・それにしても 自分が14年前ホームページをつくっていたころと
    くらべて こんなに 変わってるなんて・・・・・

これで、質問を終了します。 ありがとう ございました。

2013/05/09 17:52:54
  • id:a-kuma3
    質問の補足に書いてもらったコードは、一部、消えていると思います。
    <script> の開始や、最近貼りつけたクローバーの画像を流すところの改行とか。
    以下のような感じで、>|| ~ ||< で囲んで書きこんでみてください。

    >||
    貼り付けたいソースコード
      ...
    ||<
  • id:meichi
    コメントありがとうございます。m(_ _)m

    前の質問で ご教示いただいたクローバーを動かす下記のサンプル ↓

    http://jsfiddle.net/a_kuma3/MbDTy/2/embedded/result/

    ですが、Firefox20.0.1 でみると 大変申し訳ないのですが・・・

    左のABCのリンクが手のひら に変わらず リンクが動作
    しないです・・・・

    すみませんが、よろしくお願いします。m(_ _)m
  • id:a-kuma3
    >ですが、Firefox20.0.1 でみると 大変申し訳ないのですが・・・
    人力検索は、質問をして回答を得る場なので、質問をする度に、そんなに恐縮されなくても。
    # お人柄なんでしょうが

    今回の場合は、「Firefox で動かないじゃねぇか、a-kuma3 ごるぁ!」くらいでも良かったんじゃないか、と。
    しかも、ぼくが常用しているのは Firefox だったりするし... X-(

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

回答リクエストを送信したユーザーはいません