- ベストアンサー
<li></li>の数を制限
chochobizoの回答
- chochobizo
- ベストアンサー率42% (30/70)
回答番号：No.1に関して HTML読込終了後にscriptを走らせないとダメじゃないでしょうか？ ～省略 <script type="text/javascript"> window.onload=function() { var e = document.getElementById('box').getElementsByTagName('li'); for (var i=3; i<e.length; i++) e[i].style.display = 'none'; } </script> ～省略
関連するQ&A
- <ul><li></li></ul>にするメリットって？
<ul><li></li></ul>にするメリットって？ こんにちは。お世話になっています。 色んな方のソースを見ていると、 例えば 「ABOUT」「SERVICE」「COMPANY」・・・という項目を並べる際に <ul> <li id="about">ABOUT</li> <li id="service">SERVICE</li> <li id="company">COMPANY</li> </ul> という風にリスト化する方が多いと思うのですが中には <div id="contents"> <div class="about">ABOUT</div> <div class="service">SERVISE</service> （略） </div> という風にdivで括る方もいると思います。 （※私はdivで括るタイプです。） また。 <dl id="contents"> <dt class="about">ABOUT</dt> <dt class="service">SERVICE</dt> （略） </dl> という風に<dl><dt></dt></dl>括る方もいると思います。 それぞれのメリットってなんでしょうか？ 特に<ul><li></li></ul>という風に括ってる方がおおいと思うので <ul><li></li></ul>にするメリットが知りたいです。
- 締切済み
- HTML
- <li><h2>カテゴリ名<h2></li>でh2の文字を小さくしたい
H2の文字を小さくしたいと考えていますが、 スタイルシートでなかなか再現できません。 下記のように設定していますが間違いがありますでしょうか？ xxx.html <div id="box-cat"> <ul> <li><h2>カテゴリ名<h2></li> <li><h2>カテゴリ名<h2></li> </ul> </div> xxx.css #box-cat { width:200px; } #box-cat h2 { font-size:11px; font-weight:normal; } お力をお貸し下さい。
- ベストアンサー
- HTML
- Jquery タブで、４つのliのうち、ひとつだけ除外
お世話になります。あともう少しのところでうまくいきません！ http://papermashup.com/demos/jquery-tabs/ 上記を使ってタブをやっています 【html】 <div id="test"> <ul> <li class="menu01"><a href="#tab-1">タブ１</a></li> <li class="menu02"><a href="#tab-2">タブ2</a></li> <li class="menu03"><a href="#tab-3">タブ3</a></li> <li class="menu04"><a href="/test/">こいつだけ違うページへ</a></li> </ul> <div id="tab-1">タブ1の中身</div> <div id="tab-2">タブ2の中身</div> <div id="tab-3">タブ3の中身</div> </div> 【Jquery】 <script type="text/javascript"> $(document).ready(function(){ $('#topserch div').hide(); $('#topserch div:first').show(); $('#topserch ul li:first').addClass('active'); $('#topserch ul li a').click(function(){ $('#topserch ul li').removeClass('active'); $(this).parent().addClass('active'); var currentTab = $(this).attr('href'); $('#topserch div').hide(); $(currentTab).show(); return false; }); }); </script> まずこのままだ４つ目のリンクはまったく動きません。 そこで、return false;を取ると、当然変な動きになります。 <li class="menu04"><a href="/test/">こいつだけ違うページへ</a></li> をクリックした時だけ、普通に別のページにジャンプさせるにはどうしたらよいのでしょうか？
- ベストアンサー
- JavaScript
- UL, LIタグでの質問
いつもお世話になっています。 自分では以前から疑問に思いつつも放置していた問題です。 その問題とは、UL,LIタグでツリー表示を行い、 各項目にリンクがあります。その項目の選択位置が 項目の文字の長さによって文字がないところでも選択が出来るのです。 言語仕様であればそれで通すのですが、そういうわけでもなさそうな気配なのでどうにか解決したいと思っています。 ソースは下記のようになっていています。 <nobr><ul> <li id=foldheader><a href="">ZZZZZ</a></li> <ul id=foldinglist style=display:none style=&{head}> <li id=foldend><a href="">XXXXXXX</a></li> <ul id=foldinglist style=display:none style=&{head}> </ul> </ul> </nobr> これでいうと、ZZZZZの文字のちょっと後ろがクリックできて、XXXXXXXが表示されます。 で、XXXXXXXが表示されるとXXXXXXXの長さ＋アルファぶんだけ後ろまでZZZZZの後ろに選択できる範囲が広がります。 また、XXXXXXXの前にも選択出来る範囲が出てきます。 これを、純粋に文字の部分だけ選択出来るようにする方法はあるのでしょうか？ 以上、よろしくお願いいたします。 ※文字数制限により、開閉のJavaScriptは省略
- ベストアンサー
- HTML
- divタグ内のコンテンツが重なって表示されてしまう。
下記のようなHTMLを表示させるときに IEでは上下に並んで表示されるのですが、FF、Operaなどでは重なって表示されてしまいます。 どうしたら、上下に並べて表示させられますか？ <div id="a"> <div id="b"> <ul> <li>重なってしまう文字列</li> <li>重なってしまう文字列</li> </ul> </div> </div> <table> <!-- このテーブルタグの上に重なって表示されてしまう --> </table>
- 締切済み
- HTML
- HTMLの質問です
divタグの中にリストを２つ入れてますが、中断に<p>タグで「ＡＡＡＡＡＡＡＡＡＡ」を入れてます。 1つのdivタグ内に2つのulタグを入れるのは、基本的に間違いではないですよね？ <div id="test"> <ul> <li>ああああああああああ</li> <li>いいいいいいいいいい</li> <li>ううううううううううううう</li> <li>ええええええええええ</li> <li>おおおおおおおおお</li> </ul> <p>ＡＡＡＡＡＡＡＡＡＡＡＡＡ</p> <ul> <li>ああああああああああ</li> <li>いいいいいいいいいい</li> <li>ううううううううううううう</li> <li>ええええええええええ</li> <li>おおおおおおおおお</li> </ul> </div>
- ベストアンサー
- HTML
- <li>をfloat,inlineさせたときのセンタリング
スタイルシートを用いて、ナビゲーションバーを作っています。 リスト<li>をfloatさせて、横に長いものにしていますが、 1行では収まらないため、2行になっています。 リストにfloat:leftとinlineを指定することで、普通のテキストのように<div>ボックス内に流し込んで、端でいっぱいになったところで自動的に改行させています。 <div id="header"> <ul id="navi"> <li>トップ</a></li> <li>ページ１</li> <li>ページ２</li> <li>ページ３</li> </ul> </div> #header #navi li{ float:left; display: inline; } 実際には10個ぐらいあるのですが、説明のため上のように4つのアイテムがあるとして、説明すると、今は トップ ページ１ ページ２ と表示され、次の行で、"トップ"の左側に揃って ページ３ が表示されます。 やりたいことは、1行目のちょうど真ん中、（この場合"ページ１"の下あたり）に"ページ３"を表示させたいのです。 #header{ text-align:center; } または #header ul{ text-aligne:center; } で良いのかと思ったのですが、うまくいきません。 こういったことはできるのでしょうか？ そもそも、やり方がまちがっていますか？ <li>に対してfloatを解除すると、センタリングされるのですが、<li>同士の間にスペースが出来てしまいます（バックグラウンドに色が付いているので）。どちらかというとこちらをなんとかするようにしたほうがいいのでしょうか？
- 締切済み
- HTML
- タブ切り替えの初期表示に関して
jQueryを使用したタブの切り替えを実装しています。 下記ソースに関して、デフォルトの状態ですとselectedを設定した <div id="#a">の内容を初期表示します。 別ファイルからのリンクの飛び先が#bの時は初期表示を<div id="#b">にしたいのですが どうすればよいでしょうか？ <ul id="tab"> <li class="selected"><a href="#a">a</a></li> <li><a href="#b">b</a></li> <li><a href="#c">c</a></li> </ul> <div id="#a"> aの内容 </div> <div id="#b"> bの内容 </div> <div id="#c"> cの内容 </div> 下記のスクリプトを使用しています。 http://hyper-text.org/archives/2007/09/javascript_tab.shtml
- ベストアンサー
- JavaScript
- ドロップダウンリストの高さを、非表示のときは上に詰
初心者です。本当に初歩な質問で申し訳ありません。 ドロップダウンリストを作り、クリックしたときにサブメニューを表示したいのですが、 表示、非表示は切り替えられても、非表示のときに空欄ができてしまいます。 これを、非表示のときは上に詰めて表示するようにしたいのですが、その方法を 教えてください。 下記がそのソースになります。 <SCRIPT language="JavaScript"> <!-- function pullDown1(ss) { for(d0 = 0 ; d0 < ID.length ; d0 ++) { ID[d0].style.visibility = "hidden"; } ID[ss].style.visibility = "visible"; } //--> </SCRIPT> </HEAD> <BODY> <ol> <li><A href="javaScript:pullDown1(0)">メニューを表示する</A> <DIV id="ID" style="visibility:hidden;"> <ul> <li><A href="">A</A></li> <li><A href="">B</A></li> <li><A href="">C</A></li> <li><A href="">D</A></li> </ul> </DIV> </li> <li><A href="javaScript:pullDown1(1)">メニューを表示する</A> <DIV id="ID" style="visibility:hidden;"> <ul> <li><A href="">a</A></li> <li><A href="">b</A></li> <li><A href="">c</A></li> <li><A href="">d</A></li> </ul> </DIV> </li> </ol> </BODY> 以上、よろしくお願いいたします。
- ベストアンサー
- JavaScript
- メニューボタンのliマークアップでのヒントをください。
このソースの<a>の場所について見ておいて頂けますか。 【HTML内】 <ul> <li id="item12"><a href="#">アイテム１２ <ul> <li>看板全般</li> <li>ネオンライト</li> <li>店舗用看板</li> <li>メニュー看板</li> <li>シート看板</li> </ul> </a></li> </ul> 上記のボタンメニュー（複数がまとまったタイプ）の表示をするために、複数項目が一枚になった画像を使って<li>にa:hoveを使ったbackgraundの表示をしようと思いました。 それで後先考えず、ＣＳＳまで作ってしまい、バリデータを後からかけたら、<a>にはさまれた<ul><li>でひっかかってしまい、これはまずいと、もういちど、作りなおそうかと考え直しましたが、 よく考えると、このマークアップの形は保持して検索エンジンにはじかれないようにしたいが、<a>をどう入れていけばいいか？<img>タグは使いたくはないので、この形を利用して、<li>の中に”アイテム１２ ・看板全般・ネオンライト・～とまとめていれてしまおうかと思いましたが、どうしても妥協しているようですし、バリデータでひっかからないといえ、何のための<li>をこんな使い方にしなければいけないのか、逆にそれが、ロボットにはじかれてしまいかねないかなと不安で迷っております。 私のようなケースの場合、皆さまでしたらどうするのか、なにか良いヒントでも与えて頂けると幸いです。 宜しくお願いします。
- ベストアンサー
- HTML
お礼
ありがとうございました！実装できました！