Q&A
ご指摘ありがとうございます。
いくつか誤りがありましたので、修正しました。
したいこと：次のページに来た時に重複しないように正常に表示したいです,
php, Mysqlで作ったデータを一覧に表示して、それをjquery.pagination.jsでページネーションを作成できたのですが次のページに行くと前ページのソースコードがあって次のページの画像が並べるべき場所より下にずれて表示されてしまいます。
何が原因でしょうか？
下記に参考に画像も添付しています、どうぞご教授お願いします。
1,画像名< page_1 >は正常に表示されていますが画像< page_2 >に行くと画像上に赤で書いているところがずれて表示されているとことです。
2,画像< code >はChromeの検証でpage_2を見た時のソースコードです
code.png
page_1.png
page_2.png 赤できてあるところが下にずれているところです。
下記はソースコードです。
list.php
<html><head> <link rel="stylesheet" href="pagination/css/style.css" media="all"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script src="pagination/js/jquery.pagination.js"></script> </head> <body> <div id="paging_cat"> <?php $query = "SELECT * FROM test ORDER BY test_id DESC "; $sql = mysqli_query($con, $query); while($row = mysqli_fetch_assoc($sql)){ $test_id = $row['test_id']; $test_title = $row['test_title']; $test_image = $row['test_image']; ?> <div> <a><div><img src="../images/<?php echo $test_image; ?>"></div> <div><h1><?php echo $test_title; ?></h1></div></a> </div><?php } ?> </div> <div class="pagination text-center"><div class="pager"></div></div> /*ページネーションのJS*/ <script> $(function($) { $('#paging_cat a').pagination({ pager : $('.pager'), prevText : '前へ', nextText : '次へ', firstText : '≪', lastText : '≫', viewNum : 6, pagerNum : 3, ellipsis : true, linkInvalid : true, goTop : true, firstLastNav : true, prevNextNav : false }); }); </script> </body> </html>
回答2件
0
自己解決
jquery.pagination.jsに次のページにきたときの非表示するプログラミングを書いて解決した！
投稿2016/05/15 15:58
総合スコア79
0
いくつか変わった箇所が有るので、修正してみてください。
<body">は<body>です。<?php>という書き方はしないと思います。<?phpで良いのでは。<div id="paging_cat">がwhileの中に入っているので、外を囲うように設置されてはいかがでしょう。</h1>しか無い。
PHP
1<div><?php echo $fashion_title; ?></h1></div></a> 2```は 3```PHP 4<div><h1><?php echo $fashion_title; ?></h1></div></a> 5```では？
投稿2016/05/12 15:52
総合スコア69407
3.についてはどうでしょう。また、表示に変化はありますか？
3.については問題なく動いでいます。
3は「id="paging_cat"」が複数あるという状況になるはずなので、それが予期せず挙動を生む原因になりかねないという指摘です。idはページ内に1つだけ指定するものです。
理解不足ですみませんがidはページ内に1つだけ指定していますが複数指定するとことですか？ 宜しくお願いします
「while」は繰り返し出力する部分なので、その中でidを指定したら複数同じidが出現しませんか？スクリーンショットではそうなっていますが。
確かにそうですが、whileの外に指定しても複数同じidが出ます。
> whileの外に指定しても
質問文に追記していただけませんか？
質問文に追記しました。
お願いします
追記されたコードで同じIDが出るなら、書かれていない部分に何か記載が有るのかもしれませんね。
繰り返し部分の a タグを div で囲むなら、「$('#paging_cat > div ')」にしたほうが問題なさそうに思います。
ありがとうございます！！
jquery.pagination.jsに自力でコード書いて解決しました。
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。