jquery - jQueryのプラス/マイナスまたはリストの展開/折りたたみ

Question

誰もが、リスト内の要素を表示/非表示にするプラス/マイナスアイコンを使用して、BBCがホームページのボックス化されたコンテンツで行ったことをエミュレートすることに挑戦したいと考えています。http://www.bbc.co.uk/

私はこれを試みましたが、これまでのところ効果は正確には正しくありません。

または、同様のことを実行できるプラグインなどはありますか？

Answer 1

お返事をありがとうございます。私はこれを試しましたが、私がやっていたことには少しやり過ぎのようでした。さらに、サイトのさまざまなセクションでコードを数回実行したかったのです。

結局、私はCollapsorzと呼ばれるプラグインを見つけました。https： //github.com/akuzemchak/collapsorzは私が望んでいたことを正確に実行します。

とにかくあなたの助けをありがとう。とても有難い。

Answer 2

これは、要素を非表示にして削除するだけの問題です。

<a href="javascript:void(0)" click="$('#somelist li:visible:last').hide()">+</a>
<a href="javascript:void(0)" click="$('#somelist li:hidden:first').show()">-</a>

もちろん、ページが読み込まれたときにアイテムごとに適切なCSSを出力するものと結び付けたいと思うでしょう。（したがって、表示するアイテムの数を追跡します。

このページでこれを試すこともできます：

$('.nav li:visible:last').hide()

ファイアバグを使用している場合は、これを実行するだけで、ナビゲーションバーが変更されます。実行するたびに上部の「ボタン」が1つずつ消えます。

あなたはおそらくこの部分を扱うことができますが、とにかくここにあります。

<style>
  .hideme {
    display:none;
  }
</style>
<?php
$num_of_items = 5;
$items = array('one', 'two', 'three', 'four', 'five', 'six', 'seven');
echo "<ul id='somelist'>";
for($i=0;$i<sizeof($items);$i++) {
  echo "<li".(($i<$num_of_items)?"":" class='hideme'").">".$items[$i]."</li>";
}
echo "</ul>";
?>