回答編集履歴
3
文言の修正
answer
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
元のスクリプトだとタブを絞り込む関数がロード時しか読み込まれないので、記事本数の調節ができなくなっています。ですので、ロード時と
|
|
1
|
+
元のスクリプトだとタブを絞り込む関数がロード時しか読み込まれないので、記事本数の調節ができなくなっています。ですので、ロード時と記事選択のクリックイベント発生時にタブを絞り込むようにしないといけません。
|
|
2
2
|
|
|
3
3
|
また、自分が作ってみたサンプルをリンクしておきます。クラス名とリンク名が紐付いているので、あとはそのクラスの記事のうち、上位3回だけをループすれば簡単に取得できますよ。
|
|
4
4
|
[タブコンテンツのテスト](http://motoflabo.s500.xrea.com/tabtest.html)
|
2
jQueryのはりつけ
answer
CHANGED
|
@@ -1,4 +1,34 @@
|
|
|
1
|
-
元のスクリプトだとタブを絞り込む関数がロード時しか読み込まれないので、記事本数の調節ができなくなっています。ですので、ロード時と表示する数の調整を行う
|
|
1
|
+
元のスクリプトだとタブを絞り込む関数がロード時しか読み込まれないので、記事本数の調節ができなくなっています。ですので、ロード時と表示する数の調整を行うクリックイベント発生時にタブを絞り込むようにしないといけません。
|
|
2
2
|
|
|
3
3
|
また、自分が作ってみたサンプルをリンクしておきます。クラス名とリンク名が紐付いているので、あとはそのクラスの記事のうち、上位3回だけをループすれば簡単に取得できますよ。
|
|
4
|
-
[タブコンテンツのテスト](http://motoflabo.s500.xrea.com/tabtest.html)
|
|
4
|
+
[タブコンテンツのテスト](http://motoflabo.s500.xrea.com/tabtest.html)
|
|
5
|
+
|
|
6
|
+
```jQuery
|
|
7
|
+
$(function(){
|
|
8
|
+
/*------------------
|
|
9
|
+
表示する数の調整
|
|
10
|
+
--------------------*/
|
|
11
|
+
// tabBtnとselClassは同じ値なので紐づけできる
|
|
12
|
+
|
|
13
|
+
//絞り込みを行う関数
|
|
14
|
+
displayTopics = function(selClass){
|
|
15
|
+
$("#number_list").each(function(){
|
|
16
|
+
$('.main-contents > li').hide(); //最初に全要素を隠す
|
|
17
|
+
for( var num = 0; num < 3 ; num++){
|
|
18
|
+
$("." + selClass).eq(num).show(); //該当するクラスに対し、表示させたい3回だけ回す
|
|
19
|
+
}
|
|
20
|
+
})
|
|
21
|
+
}
|
|
22
|
+
/*----------------
|
|
23
|
+
タブ内容の絞込み
|
|
24
|
+
------------------*/
|
|
25
|
+
$('.main-contents > li').addClass('js-filter-all');
|
|
26
|
+
displayTopics('js-filter-all'); //ロード時の絞り込み
|
|
27
|
+
//イベント時の絞り込み
|
|
28
|
+
$('.main-top > li a').click(function(){
|
|
29
|
+
var tabBtn = $(this).attr('href');
|
|
30
|
+
displayTopics(tabBtn);
|
|
31
|
+
return false;
|
|
32
|
+
});
|
|
33
|
+
});
|
|
34
|
+
```
|
1
リンクを修正
answer
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
元のスクリプトだとタブを絞り込む関数がロード時しか読み込まれないので、記事本数の調節ができなくなっています。ですので、ロード時と表示する数の調整を行うときにタブを絞り込むようにしないといけません。
|
|
2
2
|
|
|
3
3
|
また、自分が作ってみたサンプルをリンクしておきます。クラス名とリンク名が紐付いているので、あとはそのクラスの記事のうち、上位3回だけをループすれば簡単に取得できますよ。
|
|
4
|
-
http://motoflabo.s500.xrea.com/tabtest.html
|
|
4
|
+
[タブコンテンツのテスト](http://motoflabo.s500.xrea.com/tabtest.html)
|