問題なくリンクが開いていたのに、firefox20.0.1
ではリンクが動かなくなりました。
すみません、ご教示いただけないでしょうか。
Firefoxは通常のブラウザに設定はしてないです。
当方Windows7です。たぶん 的はずれもいいとこ
でしょうが、質問の補足にjavascriptの部分だけ
つけさせていただきます。よろしくお願いします。
<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>
No.2
4973
2154
120pt
左のABCのリンクが手のひら に変わらず リンクが動作
しないです・・・・
クローバーの画像を動かす処理を入れましたが、それの影響でした。
追加した javascript のコードを動かすと、元々見えていたテーブルの上にウィンドウ一杯のサイズのもう一枚の板を置き、その上にクローバーの画像を置くような処理になってました。
（見えてませんが）一枚被さっているので、下のリンクが押せないという...
＃ 何で、IE の方が押せるのかの方が不思議です
板を一枚被せている辺りの処理を修正すると、期待通りになると思います。
修正した辺りを抜粋したのが、こちらです。
305
278
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 では確認しました (^^ゞ
No.1
1376156
30pt
推測で申し訳ないですが、それはページ内リンクの表記ではないでしょうか？
ページ内リンクでは以下の方法で動作すると思います。
http://www.xml.vc/hp/keitai/link-id1.html
<p><a href="#jump">移動元</a></p> ～途中略～ <h2 id="jump">ジャンプ先</h2>
No.2
49732154
ここでベストアンサー
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 では確認しました (^^ゞ
早いレス 大変 ありがとう ございます。m(_ _)m
動きました。（感謝！！）
・・・・それにしても 自分が14年前ホームページをつくっていたころと
くらべて こんなに 変わってるなんて・・・・・
これで、質問を終了します。 ありがとう ございました。
a-kuma3
2013/05/09 11:54:40
meichi
1
1
早いレス 大変 ありがとう ございます。m(_ _)m
2013/05/09 17:52:54動きました。（感謝！！）
・・・・それにしても 自分が14年前ホームページをつくっていたころと
くらべて こんなに 変わってるなんて・・・・・
これで、質問を終了します。 ありがとう ございました。