1ページのウェブサイトページのフッターを指定しました。位置：変更

Question

私は1ページレイアウトのウェブサイトを構築しています。 今私はclass = "footer-bar"をposition：absoluteにしたいと思っていますが、#Home Pageではposition：relativeでなければなりません。

ページごとにページを変更する方法を知っている人はいますか？フッターは、各ページに書き込まれるべきではありません。 1回だけ。私がページ＃ホームにいれば、CSSの変更だけです。

アイデアをありがとう。

私は、この作品ではない、私はあなたの質問を取得するかどうかわからないんだけど、私が理解から、でしょう

<ul> 
<li><a href="#Home">Home</a></li> 
<li><a href="#Other">Home</a></li> 
</ul> 

<ul class="tabs-content"> 
<li id="Home"> Content Page Home </li>  ---->Footer position:relative 
<li id="Other"> Content Other Page </li>  ---->Footer position:absolute 
</ul> 

<div class="footer">Footer Content</div> 

Answer 1

：

.footer-bar { 
position: absolute; 
/* the rest of your styles */ 
} 

.footer-bar#Home { 
position: relative; 
/* anymore additional styles */ 
} 

EDIT：

は、上記で#Homeを作りますcss a .Home、そして必要な関数に以下のjQueryを入れてください。

$(".footer-bar").addClass("Home"); 

それとも

$(".footer-bar").css("position","relative"); 

Answer 2

あなたは、私が想像するこれを行うにはjQueryのようなものを使用する必要があるとしています。

いつでもアクティブになっているタブを特定する方法が必要です。そのため、ナビゲーションリンクにclickイベントを作成して、アクティブなクラスをタブに切り替えることができます。

アクティブなタブをクエリし、それがあなたの「ホーム」タブであるかどうかをテストし、必要に応じてCSSを調整できます。

これはちょっと濁っている場合は、私はあなたのためのフィドルを振るでしょう。ここで=）

Answer 3

は、私はそれをやった方法です：

$("#navpoint1, #navpoint2, #navpoint3, #navpoint4").bind("click", function() { 
     $(".footerbar").css({ 

     position: 'absolute', 
     bottom: '0' 

     }); 
    });