質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

1回答

1260閲覧

タブパネルが機能しない

退会済みユーザー

退会済みユーザー

総合スコア0

CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2020/09/14 05:12

編集2020/09/16 04:45

タブパネルの機能を使ってページ送りの機能つけたんですが、全てのタブでページ送りすると他のお知らせのタグや、ブログのタグも連動して動きます。全てのタブにページ送りの機能をつけたいです。

php

1<div id="NEWS"> 2 <div class="NEWS-title"> 3 <h1>news</h1> 4 </div> 5 <div class="tab-wrap"> 6 <div class="tab-group"> 7 <div class="tab is-active">全て</div> 8 <div class="tab">お知らせ</div> 9 <div class="tab">ブログ</div> 10 </div> 11 </div> 12 <div class="panel-group"> 13 <div class="panel is-show"> 14 <?php 15 $paged = get_query_var('paged') ? get_query_var('paged') : 1 ; 16 $args = array( 17 'post_type' => 'post', 18 'category_name' => 'news,blog', 19 'posts_per_page' => 3, 20 'paged' => $paged 21 ); 22 $the_query = new WP_Query( $args ); 23 if ( $the_query->have_posts() ) : while ( $the_query->have_posts() ) : 24 $the_query->the_post(); 25 ?> 26 <div class="left-post-date"> 27 <?php echo get_the_date(); ?> 28 </div> 29 <div class="left-post-item"> 30 <?php the_category(); ?> 31 </div> 32 <a href="<?php the_permalink(); ?>" class="left-post-title"> 33 <?php echo get_the_title(); ?></a> 34 <?php endwhile; ?> 35 <?php endif; ?> 36 <div class="nav-previous alignleft"> 37 <?php if (get_previous_post()):?> 38 <?php next_posts_link( '<img src="'. get_template_directory_uri().'/img/競技.png" />' ); ?> 39 <?php endif; ?> 40 </div> 41 <div class="nav-next alignright"> 42 <?php if (get_next_post()):?> 43 <?php previous_posts_link( '<img src="'. get_template_directory_uri().'/img/競技-2.png" />' ); ?></div> 44 <?php endif; ?> 45 </div> 46 <?php wp_reset_postdata(); ?> 47 <div class="panel"> 48 <?php 49 $args = array( 50 'post_type' => 'news', 51 'category_name' => 'news', 52 'posts_per_page' => 3, 53 'paged' => $paged 54 ); 55 $the_query = new WP_Query( $args ); 56 if ( $the_query->have_posts() ) : while ( $the_query->have_posts() ) : 57 $the_query->the_post(); 58 ?> 59 <div class="center-news-date"> 60 <?php echo get_the_date(); ?> 61 </div> 62 <div class="center-news-item"> 63 <?php the_category(); ?> 64 </div> 65 <a href="<?php the_permalink(); ?>" class="center-news-title"> 66 <?php the_title(); ?></a> 67 <?php endwhile; ?> 68 <?php endif; ?> 69 <?php wp_reset_postdata(); ?> 70 </div> 71 <div class="panel"> 72 <?php 73 $args = array( 74 'post_type' => 'blog', 75 'category_name' => 'blog', 76 'posts_per_page' => 3, 77 ); 78 $the_query = new WP_Query( $args ); 79 if ( $the_query->have_posts() ) : while ( $the_query->have_posts() ) : 80 $the_query->the_post(); 81 ?> 82 <div class="left-news-date"> 83 <?php echo get_the_date(); ?> 84 </div> 85 <div class="left-news-item"> 86 <?php the_category(); ?> 87 </div> 88 <a href="<?php the_permalink(); ?>" class="left-news-title"> 89 <?php the_title(); ?></a> 90 <?php endwhile; ?> 91 <?php endif; ?> 92 <?php wp_reset_postdata(); ?> 93 </div> 94 </div> 95 </div> 96</div>

js

1jQuery(function($){ 2 $('.tab').on('click',function(){ 3 var idx=$('.tab').index(this); 4 $(this).addClass('is-active').siblings('.tab').removeClass('is-active'); 5 $(this).closest('.tab-wrap').next('.panel-group').find('.panel').removeClass('is-show'); 6 $('.panel').eq(idx).addClass('is-show'); 7 }); 8 });

試したこと
お知らせや、ブログの部分にページ送りの機能をつけると、お知らせの部分に書いてあったものが表示されなくなる。
全ての部分のタグが表示されます。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

自分で解決できました。ありがとうございます。

投稿2020/09/16 09:26

退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問