0

私は、他の誰かによって既に構築されたサイトのナビゲーションに取り組んでいます。ページが存在するリンクのアクティブなクラスがありますが、最後のクラスがアクティブなクラスのリンクに追加されると、ブラウザでアクティブなリンクのみがレンダリングされます。ブラウザでソース コードを見たところ、2 つのクラスのうちの 1 つしか表示されませんでした。最後のナビゲーション アイテムは、この 2 番目のクラスを持つ唯一のアイテムです。ページが最後のナビゲーション項目にある場合にのみ、正しく機能しません。

これはおそらく私が見落としている単純なものだと思います。これについて何か助けていただければ幸いです。

tl:dr - 最後のナビゲーション アイテムの .last クラスしかレンダリングできません。

CSSがひどい場合は申し訳ありません。私はそれを書きませんでした。

サイトページ: http://securitybank.designangler.com/insurance

CSS:

#navigation .MainNavigation{
position:relative;
padding:12px 0px;
margin:0px 0px 0px 8px; /* left margin Changed from 28px on 10-21-13 */
list-style:none;
}

#navigation .MainNavigation li{
display:inline;
padding:12px 0px 0px 0px;
margin:0px 0px 0px 0px;
text-align:center;
}

#navigation .MainNavigation li a{
font-size:13px;
color:#FFF;
text-decoration:none;
padding:12px 14px 12px 14px;
margin:0px 0px 0px 0px; 
border-left:#648558 2px solid;
}

#navigation .MainNavigation li a.last{
border-right:#648558 2px solid;
}

#navigation .MainNavigation li a.active{
padding:12px 19px 12px 17px;
background: url(/_images/bkgd_Active.png) repeat;
}

#navigation .MainNavigation li a:hover{
background: url(../_images/bkgd_NavHover.png);
}
4

1 に答える 1

2

短い議論の後、結論は、クラス「アクティブ」が埋め込み JavaScript によって設定され、バグのために、同じスクリプトがページの読み込み時にクラス「最後」を削除していたというものでした。

具体的には、次の JS 行でした。

aObj[i].className='active';

解決策は、上記の行を次のように置き換えることです。

var saved = aObj[i]; saved.className = saved.className + " active";

特定の要素にクラスを追加するにはどうすればよいですか? の助けを借りて修正しました。

于 2013-10-27T10:08:10.183 に答える