<script type="text/javascript">
$(document).ready(function(){
$('#info a.tooltip').addClass('active');
});
</script>
<ul class="ca-menua">
<li><a href="#home" class="tooltip"><span class="ca-icona">O</span></a></li>
<li><a href="#info" class="tooltip"><span class="ca-icona" id="info">e</span></a></li>
<li><a href="#komp" class="tooltip"><span class="ca-icona">S</span></a></li>
<li><a href="#cases" class="tooltip"><span class="ca-icona">F</span></a></li>
<li><a href="#kont" class="tooltip"><span class="ca-icona">@</span></a></li>
</ul>
a.tooltip.active #info {
color: #f3cb12;
font-size: 50px;
}
アクティブリンクエフェクトを実行しようとしていますが、正しく表示できないようです。効果はこのリンクにあります(フロントページではなく2ページから)ここをクリックしてWebサイトを表示します。
「アクティブな機能は機能しません。特定のページにいるときは、そのページのナビゲーションアイテムがアクティブになっているはずです。現在は機能していません。これにより、現在地を確認できます。」
Javascript:
<script type="text/javascript">
$(function() {
$('a.tooltip').click(function(e) {
var $this = $(this);
$(".ca-menua").load($this.attr('href'));
$('a.tooltip').removeClass('active');
$(this).addClass('active');
// prevent default link click
e.preventDefault();
})
});</script>
HTML:
<ul class="ca-menua">
<li><a href="#home" class="tooltip"><span class="ca-icona">O</span></a></li>
<li><a href="#info" class="tooltip"><span class="ca-icona">e</span></a></li>
<li><a href="#komp" class="tooltip"><span class="ca-icona">S</span></a></li>
<li><a href="#cases" class="tooltip"><span class="ca-icona">F</span></a></li>
<li><a href="#kont" class="tooltip"><span class="ca-icona">@</span></a></li>
</ul>
CSS:
li a.tooltip.active .ca-icon {
color: #f3cb12;
font-size: 50px;
}
ありがとう :-)