顯示DIV，然後去一個元素DIV

內目前我正在試圖取消隱藏一個DIV，然後之後向下滾動到的元素。顯示DIV，然後去一個元素DIV

我有這個文本的「索引」，我有一個錨定標記清單href'ing不同的ID在頁面下，但乍一看文本是隱藏的，並且將首先顯示當你點擊一個索引鏈接。所有這一切工作正常，直到我滾動部分。

到目前爲止，代碼沒有什麼特別之處，它僅僅是一條if語句，根據客戶端動作添加&刪除CSS類。但是，如何讓頁面在DIV顯示後自動向下滾動？

我試過這個解決方案：How to go to specific to element on page，但我似乎無法適應在我自己的腳本。

if ($('#<%=paragraph.ClientID%>').hasClass("readable")) { 
    $('#<%=paragraph.ClientID%>').removeClass("readable"); // Readable is the class that hides the paragraphs. 
    // Run function to scroll down to selected element here. 
} 
else { 
    $('#<%=paragraph.ClientID%>').addClass("readable"); 
}

我第一次嘗試是這樣的：

(function($) { 
     $.fn.goTo = function() { 
      $('html, body').animate({ 
       scrollTop: $(this).offset().top + 'px' 
      }, 'fast'); 
      return this; // for chaining... 
     } 
    })(jQuery); 

    function showParagraphs(elementId) { 
     if ($('#<%=paragraph.ClientID%>').hasClass("readable")) { 
      $('#<%=paragraph.ClientID%>').removeClass("readable"); 
      scrollToElement(elementId); 
     } 
     else { 
      $('#<%=paragraph.ClientID%>').addClass("readable"); 
     } 
    }; 

    function scrollToElement(elementId) { 
     $(elementId).goTo(); 
    };

但上面的腳本沒有工作。而我的JavaScript技能是有限的，所以我有點失落。

任何提示或幫助將是真棒。謝謝。

來源

2011-01-26 diceler

這將是容易得多，如果你能告訴你當前的代碼/ HTML的相應部分。 – kapa 2011-01-26 10:02:46

我第二個bazmegakapa。你想要達到什麼目的？結構是什麼樣的？給我們'肉':-) – mahatmanich 2011-01-26 10:08:58

你的代碼看起來大多工作。我認爲你需要改變的唯一的事情是，在你的showParagraphs功能，你只需要...

與scrollToElement('#<%=paragraph.ClientID%>')

更換scrollToElement(elementId) ......因爲你拉id您想要的元素來自服務器的影響，而不是傳入的參數。

如果不這樣做，here's a working demo that I threw together，你可以嘗試實現作爲替代。

來源

2011-01-26 10:27:55 mVChr

如果我沒有理解你的問題所在，這是一個簡單的解決方案。要等待事件完成，請使用回調函數。

示例代碼：

$('.clickable').onclick(function(){ 
    $('.mydiv').show('slow', function(){ 
    location.href = '#myElement'; 
    }); 
});

And link to jQuery.show() docs

哦，也許是困惑...... '.clickable' 是你的行動觸發（按鈕，鏈接）， '.mydiv' 是你的div顯示出來，#myElement是你想要滾動到的元素的id。

來源

2011-01-26 10:13:41 usoban

顯示DIV，然後去一個元素DIV

回答

相關問題