-1

4 つのサブページを含むページを作成したいと考えています。最初のサブページから自動的に開始されます。

ユーザーがサブメニューから別のタブをクリックすると、通常は別のページが作成されますが、コンテンツが少し変更された大きなページになりました。

jQuery のドキュメントで contents() 関数を見つけましたが、それだけではないと思います。

stackoverflow で iFrame に関する質問をいくつか見たので、iFrame を使用する必要があるのではないかと考えていましたが、コンテンツを変更する方法がわかりませんでした。

また、そのために4つの異なるワードプレスページを使用するよりもまだ可能かどうか疑問に思っていました.

ありがとう ：）

4

1 に答える 1

1

1 つのページですべてを作成し、jQuery を使用して各要素を表示および非表示にすることができます。

CSS

.hideme { display: none; }
#div1 {
    width: 300px;
    height: 300px;
    background-color: lightgreen;
}
#div2 {
    width: 300px;
    height: 300px;
    background-color: lightblue;
}
#div3 {
    width: 300px;
    height: 300px;
    background-color: yellow;
}

HTML

<a href="#" name="div1">div one</a>
<a href="#" name="div2">div two</a>
<a href="#" name="div3">div three</a>

<div id="div1" class="box">Some content 1</div>
<div id="div2" class="box hideme">Some content 2</div>
<div id="div3" class="box hideme">Some content 3</div>

Jクエリ

$('a').on('click', function() {
    var thisDiv = $(this).attr('name'); //get the name value
    $('.box').css('display','none'); //change all "boxes" to hidden
    $('#' + thisDiv).css('display','block'); //get specific box and unhide
});

より良い例: http://jsfiddle.net/neuroflux/W8UQm/4/

于 2013-08-19T07:48:00.853 に答える