ページ内のページャを作成してみた。ページ内のページャを作成してみた。技術スポンサードリンク仕事でページ内のページャを作ったので早速やったことをメモしてみる。適切な用語を知らないので実物を以下に貼ってみる。CodePen.0こんな感じで、サンプルは本当に単純にcssで消したり表示したりでページ遷移してるように見せかけてるだけのもの。実際はページ数が表示するものによって増えたり減ったりしていく。タグの個数自体はjspだのPHPだの側でforをまわした方が早いと思うので置いておくとして一定数以上ページがあると、レイアウトが多分すごいことになる。(100ページくらいあると、右端まで伸びて改行していくことになると思う。)なので、仮に表示するページャは3個までとしてみる。CodePen.0解説メモ・HTMLただのHTMLのようだ無駄にbootstorapを使ってお洒落なページャにしております。・CSSdisplay:noneとはその要素を画面上に表示しなくなる表記。これを付けは図示することで、あたかもページを遷移しているかのように要素を消したり見せたりしている。・js上の方でページの制御ページャの何処かがクリックされたら、まず全部にnoneクラスを付けて見えなくする。その後、クリックされた箇所のインデックスに対応するgroupの箇所からnoneクラスをremoveしてあげる。下の方(15行目くらいから)で表示するページャの調整を行う。前後に表示することになる数値を、最初に設定したrange分足し引きして取得。ここで、表示する最小値or最大値をはみ出してしまう場合があるので例外処理を入れている。表示する範囲からnoneを取り除く。いい方法あるけど、今回はこれくらい。何かセミナー参加日記とか、技術書読んだよ日記もつけてみたい。英語力も欲しさがある。某配送システム白猫プロジェクトのアイシャが大好きなエンジニアの卵。Java/Shell/C++/HTML/Sass/rustかgoやりたい。コメントをキャンセルメールアドレスが公開されることはありません。コメントデータの処理方法の詳細はこちらをご覧ください。WordPress.。