締切済み

タブレットのドロップダウンメニューについて

2013/10/28 15:29

会社のWebの管理をしていますが、５年前に作ったサイトはJavaScriptを使ってドロップダウンにしました。しかしタブレットではドロップダウンメニューが開かずページの遷移ができません。メニューを修正してタブレットやスマホでもリンク先のページに遷移させるのにはどうしたら良いか教えて下さい。商品のところはドロップダウンで20個程表示されます。 Webについてはほぼ素人でHTMLとCSSは独学で勉強し、JavaScriptは本やサイトのサンプルデータを使わせていただいていて、内容についてはあまり理解していません。タブレットやスマホではそもそもドロップダウンメニューが使えないようなのですが。サイトで検索しましたが、今一参考にできそうなサイトにたどりつけませんでした。アドバイスよろしくお願いします。

oyajin082
お礼率85% (72/84)

JavaScript
回答数2
ありがとう数7

みんなの回答 （2）
専門家の回答

みんなの回答

ORUKA1951
ベストアンサー率45% (5062/11036)

2013/10/28 19:35 回答No.2

javascriptは色々な問題がありCSSで可能な物はCSSで行ったほうが良いです。特に企業の場合はSEOを考慮すると、javascriptでのナビゲーションは避けるべきです。「JavaScript、Cookie、セッション ID、フレーム、DHTML、Flash などの特殊な機能が使用されているためにサイトの一部がテキストブラウザで表示されない場合、検索エンジンのスパイダーがサイトをうまくクロールできない可能性があります。google-ウェブマスター向けガイドライン（品質に関するガイドライン）( https://support.google.com/webmasters/answer/35769?hl=ja#2 )」　HTMLがきちんと書かれていたら、CSSで色々にデザインできます。　￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ ★ナビゲーションリストを様々にデザインしてみよう。( http://www.ichiya.com/WebService/Howto/sample/HTML/nav/navigation1.html ) ★タブは＿に置換してあるので戻す。 ★リキッドなのでPCでもスマホでも、ウィンドウ幅に関わらずそのままサンプル <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> ＿<meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> ＿<title>サンプル</title> ＿<meta name="author" content="ORUKA1951"> ＿<meta http-equiv="Content-Style-Type" content="text/css"> ＿<link rev="made" href="mailto:oruka1951@hoge.com" title="send a mail" > ＿<link rel="START" href="../index.html"> ＿<style type="text/css">  ＿</style> </head> <body> ＿<div class="header"> ＿＿<h1>タイトル</h1> ＿＿<div class="nav"> ＿＿＿<ol> ＿＿＿＿<li><a href="/">Top</a></li> ＿＿＿＿<li><a href="/Products">製品</a> ＿＿＿＿＿<ol> ＿＿＿＿＿＿<li><a href="/Products/A">製品A</a></li> ＿＿＿＿＿＿<li><a href="/Products/B">製品B</a></li> ＿＿＿＿＿＿<li><a href="/Products/C">製品C</a></li> ＿＿＿＿＿</ol> ＿＿＿＿</li> ＿＿＿＿<li><a href="/Support">サポート</a> ＿＿＿＿＿<ol> ＿＿＿＿＿＿<li><a href="/Support/A">A</a></li> ＿＿＿＿＿＿<li><a href="/Support/B">B</a></li> ＿＿＿＿＿＿<li><a href="/Support/C">C</a></li> ＿＿＿＿＿</ol> ＿＿＿＿</li> ＿＿＿＿<li><a href="/Profile.html">会社情報</a></li> ＿＿＿</ol> ＿＿</div> ＿</div> ＿<div class="section"> ＿＿<h2>見出し</h2> ＿＿<p>・・・</p> ＿</div> ＿<div class="footer"> ＿＿<h2>文書情報</h2> ＿＿<dl class="documentHistry"> ＿＿＿<dt id="FIRST-PUBLISHED">First Published</dt> ＿＿＿<dd>2012-08-10</dd> ＿＿＿<dt id="LAST-MODIFIED">Last Modified</dt> ＿＿＿<dd>2012-08-10 12:00:00 (JST)</dd> ＿＿</dl> ＿＿<address>© ORUKA1951 2012 - 2016 All Rights Reserved mailto:*****</address> ＿</div> </body> </html>