2016-09-09 7 views
0

ユーザーがJavascriptを使用して特定のタブをクリックしたときに、htmlページから特定のhtmlタブページに移動する方法?Javascriptを使用して特定のタブにユーザーを引き込む方法は?

htmlページの特定のタブを別のhtmlページにリンクするようなものを作成したいので、ユーザーがリンクをクリックすると特定のタブに移動します。

は、HTMLの両方がこれはこれは私のservice.htmlのタブページのコード

である私のHome.htmlページコード

<style> 
body { 
    margin-top: 50px; 
} 

.box { 
    border: 3px solid blue; 
    height: 250px; 
    width: 250px; 
    margin: 20px 0; 
} 

.btn-success { 
    margin: 200px 55px; 
} 

</style> 

    </head> 
    <body> 

<div class="container"> 
    <div class="row"> 
    <div class="col-md-4"> 
     <div class="box"> 
     <a href="" class="btn btn-success">LEARN MORE 1</a> 
     </div> 
</div> 
<div class="col-md-4"> 
    <div class="box"> 
    <a href="" class="btn btn-success">LEARN MORE 2</a> 
    </div> 
</div> 
<div class="col-md-4"> 
    <div class="box"> 
    <a href="" class="btn btn-success">LEARN MORE 3</a> 
    </div> 
</div> 
<div class="col-md-4"> 
    <div class="box"> 
    <a href="" class="btn btn-success">LEARN MORE 4</a> 
    </div> 
</div> 
<div class="col-md-4"> 
    <div class="box"> 
    <a href="" class="btn btn-success">LEARN MORE 5</a> 
    </div> 
</div> 
<div class="col-md-4"> 
    <div class="box"> 
    <a href="" class="btn btn-success">LEARN MORE 6</a> 
    </div> 
</div> 
</div> 
    </div> 

ある

の.htmlファイルを分離しています

<div class="tab-content"> 
     <div id="LEARN-MORE-1" class="tab-pane fade in active"> 
      <h3>LEARN MORE 1</h3> 
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> 
     </div> 
     <div id="LEARN-MORE-2" class="tab-pane fade"> 
      <h3>LEARN MORE 2</h3> 
      <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p> 
     </div> 
     <div id="LEARN-MORE-3" class="tab-pane fade"> 
      <h3>LEARN MORE 3</h3> 
      <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam.</p> 
     </div> 
     <div id="LEARN-MORE-4" class="tab-pane fade"> 
      <h3>LEARN MORE 4</h3> 
      <p>Eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.</p> 
     </div> 
     </div> 
    </div> 

私はJavascriptの知識がありません。私のJavascriptコードをここで提供しないことを誓う。私はどのようにjavascriptファイルを作成するか分かりません。

[詳細]ボタンをクリックして使用すると、htmlページをリンクして特定のタブに移動する方法を教えてください。このような

何か:

this

あなたのヘルプは大歓迎します!あなたは、タブのコンセプトをbootstarp使用することができ、より良い、JavaScriptの知識をお持ちでない場合は

<a href="page_link#desired_tab_id"> 

答えて

関連する問題