ページ上部にナビをつけて(リストをcssで調整)、クリックすると該当箇所まで
ジャンプする形をとりたいと思っています。
Chrome、IEでは思ったように動いてくれるのですが、
Firefox(52.0.2)では近くまではいくのですが、
思っているところより下の方に移動してしまいます。
何か対応方法がありましたら、教えてくださいませ。
<div class="menu"> <ul class="menu-a"> <li><a href="#">北海道</a><ul><li></li> </ul> </li> <li> <a href="#tohoku">東北地方</a><ul> <li><a href="#miyagi">宮城県</a></li> <li><a href="#akita">秋田県</a></li> </ul> </li> </ul> </div> <div class="menu"> <ul class="menu-a"> <li> <a href="#kanto">関東地方</a><ul> <li><a href="#gunma">群馬県</a></li> <li><a href="#saitama">埼玉県</a></li> </ul> </li> <li> <a href="#chubu">中部地方</a><ul> <li><a href="#yamanashi">山梨県</a></li> <li><a href="#nagano">長野県</a></li> </ul> </li> </ul> </div> -------------------------------------------- <a name="tohoku" id="tohoku"></a> <!--東北地方--> <div class="pref-box-03"> <div> <a name="miyagi" id="miyagi"></a> <div> ■■■■■■ </div> </div> <a name="yamagata" id="yamagata"></a> <div> ■■■■■■ </div> </div> <a name="kanto" id="kanto"></a> <!--関東地方--> <div class="pref-box-04"> <a name="gunma" id="gunma"></a> <div> ■■■■■■ </div> <div> ■■■■■■ </div> <a name="saitama" id="saitama"></a> <div> ■■■■■■ </div> </div>
###試したこと
<a name="●●" id="●●"></a>
の間にスペースを入れてみましたが、動作は変わらずでした。
【追記】
教えて頂きましたページを参考に変更してみました。
こちらでも「tokyo」をクリックするとfirefox(ver54)だと
tokyo指定部分より少し下にジャンプしてしまいます。
HTML
1 2<div class="menu_box"> 3<ul class="menu"> 4<li> 5<a href="#">東北地方</a><ul> 6<li><a href="#tohoku">青森県</a></li> 7<li><a href="#tohoku">岩手県</a></li> 8<li><a href="#miyagi">宮城県</a></li> 9<li><a href="#tohoku">秋田県</a></li> 10<li><a href="#tohoku">山形県</a></li> 11<li><a href="#fukushima">福島県</a></li> 12</ul> 13</li> 14<li> 15<a href="#">関東地方</a><ul> 16<li><a href="#kanto">茨城県</a></li> 17<li><a href="#kanto">栃木県</a></li> 18<li><a href="#gunma">群馬県</a></li> 19<li><a href="#saitama">埼玉県</a></li> 20<li><a href="#chiba">千葉県</a></li> 21<li><a href="#tokyo">東京都</a></li> 22<li><a href="#kanagawa">神奈川県</a></li> 23</ul> 24</li> 25</ul> 26</div> 27 28 29 30<div id="miyagi" name="#miyagi"></div> 31<div> 32■■■■■■■■■ 33</div> 34 35 36<div id="fukushima" name="#fukushima"></div> 37<div> 38■■■■■■■■■ 39</div> 40 41 42 43<div id="kanto" name="#kanto"></div> 44<!--関東地方--> 45 46 47<div id="gunma" name="#gunma"></div> 48<div> 49■■■■■■■■■ 50</div> 51 52<div id="saitama" name="#saitama"></div> 53<div> 54■■■■■■■■■ 55</div> 56 57<div> 58■■■■■■■■■ 59</div> 60 61<div> 62■■■■■■■■■ 63</div> 64 65<div> 66■■■■■■■■■ 67</div> 68 69<div> 70■■■■■■■■■ 71</div> 72 73<div> 74■■■■■■■■■ 75</div> 76 77<div> 78■■■■■■■■■ 79</div> 80 81<div id="chiba" name="#chiba"></div> 82<div> 83■■■■■■■■■ 84</div> 85 86<div id="tokyo" name="#tokyo"></div> 87<div> 88■■■■■■■■■ 89</div> 90 91<div> 92■■■■■■■■■ 93</div> 94 95<div> 96■■■■■■■■■ 97</div> 98 99<div> 100■■■■■■■■■ 101</div> 102 103 104<div id="kanagawa" name="#kanagawa"></div> 105<div> 106■■■■■■■■■ 107</div> 108 109<div> 110■■■■■■■■■ 111</div> 112 113<div> 114■■■■■■■■■ 115</div> 116 117