質問編集履歴

2

コードの追加

2019/09/25 05:15

投稿

sakusakupanda
sakusakupanda

スコア12

test CHANGED
File without changes
test CHANGED
@@ -27,6 +27,16 @@
27
27
 
28
28
 
29
29
  殴り書きで文章もまとまっていませんが回答いただければ幸いです。よろしくお願いします。
30
+
31
+
32
+
33
+
34
+
35
+ 9/25追加
36
+
37
+ 下記の部分を追加しましたところappendした要素に対してもイベント発火するようになりましたが
38
+
39
+ apenndする前の同じ要素にイベントが重複してしまいます。スクロールするたびにイベントが重なるようになりました。
30
40
 
31
41
 
32
42
 
@@ -93,3 +103,57 @@
93
103
  })
94
104
 
95
105
  ```
106
+
107
+
108
+
109
+
110
+
111
+ ```
112
+
113
+ :javascript
114
+
115
+ var luminousTrigger = document.querySelectorAll('#luminous')
116
+
117
+ if( luminousTrigger !== null ) {
118
+
119
+ new LuminousGallery(luminousTrigger);
120
+
121
+ }
122
+
123
+ ___________________________________________________________________________
124
+
125
+ $('#menus').on( 'append.infiniteScroll', function() {
126
+
127
+ var luminousTrigger = document.querySelectorAll('#luminous')
128
+
129
+ if( luminousTrigger !== null ) {
130
+
131
+ new LuminousGallery(luminousTrigger);
132
+
133
+ }
134
+
135
+ });
136
+
137
+ //この部分を追加
138
+
139
+ ___________________________________________________________________________
140
+
141
+ $(function() {
142
+
143
+ $('#menus').infiniteScroll({// 監視してほしい範囲のタグのクラス
144
+
145
+ path : 'nav.pagination a[rel=next]', // 次ページのリンク(kaminari使ってる)
146
+
147
+ append : '.root_page__right__contents__list', // 読まれたら追加していくタグのクラス
148
+
149
+ history: false, // ページが読まれてもURLを変えない
150
+
151
+ prefill: true, // 一番下まで読まれる前にpathを読み込む
152
+
153
+ status: '.page-load-status' // 読み込み中表示したいタグのクラス
154
+
155
+ })
156
+
157
+ })
158
+
159
+ ```

1

参考記事の追加

2019/09/25 05:15

投稿

sakusakupanda
sakusakupanda

スコア12

test CHANGED
File without changes
test CHANGED
@@ -27,6 +27,14 @@
27
27
 
28
28
 
29
29
  殴り書きで文章もまとまっていませんが回答いただければ幸いです。よろしくお願いします。
30
+
31
+
32
+
33
+ 参考記事 
34
+
35
+ https://glitter-style.jp/labo/web-resource/coexist-photoswipe-and-infinite-scroll/
36
+
37
+ https://haayaaa.hatenablog.com/entry/2019/03/12/204522
30
38
 
31
39
 
32
40