jquery或css高亮顯示div上的跳轉/滾動

我想通過點擊錨鏈接來突出顯示div。如果我在<a href="$id1" class="scroll">My link</a>jquery或css高亮顯示div上的跳轉/滾動

點擊要比滾動<div id="id1">here</div>在這個頁面上我有很多的錨鏈接和DIV，因此它是非常混亂，以確定哪個格，然後滾動以更好地突出顯示點擊錨格邊框我的意思是。我嘗試了下面的代碼，但它不起作用。

<script type="text/javascript"> 
     // anchor click jump scroll 
     jQuery(document).ready(function(jQuery) { 

      jQuery(".scroll").click(function(event){   
       event.preventDefault(); 
       jQuery('html,body').animate({scrollTop:$(this.hash).offset().top}, 500); 
      }); 
     }); 

     jQuery(".scroll").click(function() { 
      jQuery("#post-<?php echo get_the_ID(); ?>").css("border", "1px solid #ff0000").delay(1000).css("border", "none"); 
     }; 
    </script>

我不知道，如果它確實需要jQuery用戶界面或者只是jQuery是足夠

來源

2012-10-16 Code Lover

它不需要jQuery UI，只需要jQuery。但我不明白爲什麼你在兩個不同的時刻再次訂閱'click'事件兩次（一個是內聯的，另一個是DOM準備好的時候）。 –

因爲我不是專家，只是試圖學習jQuery，所以不知道如何使用它。 –

噢好吧，我想我得到你想要做的事情：你想滾動到鏈接中的引用元素，並對此元素應用樣式（順便說一下，它是<a href="#id1">中的#）。

的代碼應該然後寧可：

jQuery(document).ready(function() { 
    jQuery(".scroll").click(function(event){ 
     var $target = jQuery(this.hash); 

     event.preventDefault(); 
     jQuery('html,body').animate({scrollTop:$target.offset().top}, 500); 
     $target.css("border", "1px solid #ff0000").delay(1000).css("border", "none"); 
    }); 
});

編輯，以便使用jQuery，而不是$。

來源

2012-10-16 10:02:57

這是突出顯示的邊界，但現在停止滾動.. –

感謝您的更新，但現在它表現出一些奇怪。有時候它會滾動，有些時候會跳轉，當它的滾動不會突出顯示，但是跳轉的時候它會跳動 –

嗡嗡聲，奇怪的......但也許動畫應該只在'html'上（而不是在body上）。 –