以下は、jQuery Modal Box 用に作成した基本的なボックス、CSS、および JS の例です。
<!-- hidden boxes // -->
<div id="content_1" class="box">
<h1>First Box</h1>
<p>Content goes here...</p>
</div>
<div id="content_2" class="box">
<h1>Second Box</h1>
<p>Content goes here...</p>
</div>
.....
<!-- links for boxes // -->
<a href="#content_1" class="link">Show First Box</a>
<a href="#content_2" class="link">Show Second Box</a>
<!-- css // -->
<style>
.box {
display: none;
}
</style>
<!-- javascript // -->
<script type="text/javascript">
$(document).ready( function() {
$('.link').click( function() {
// process modal
});
});
</script>
したがって、ユーザーが First/Second Box リンクをクリックすると、jQuery モーダル ポップアップがコンテンツとともに表示されます。私の目的はテキストを隠すことではありません。いくつかのブログで聞いたり読んだりしたことがありますが、Google は非表示のテキストに対して何らかの措置を講じます。私のやり方は違法/SEOに悪いですか? または、なしでこれを行うより良い方法はありますdisplay:none
か?