通過點擊另一個元素暫停SuperSized.js

我真的不「獲得」jQuery - 我只使用JS來改變DOM屬性客戶端 - 但是當一個工具符合條例草案時，您必須使用它。我在我的頁面上運行了一個超大尺寸的幻燈片，並且我在底部的導航欄中添加了幾個按鈕。點擊這些按鈕後，我打開一個窗口，顯示有關當前幻燈片的更多信息，但因爲它是「當前」幻燈片，所以我需要在窗口打開時停止顯示。除了這種停止業務外，一切都運轉良好。我提到的API，並且有一個調用，它做到了這一點：通過點擊另一個元素暫停SuperSized.js

$(element).click(function(){ 
    api.playToggle(); 
});

...但我怎麼把這個在onclick另一個元素呢？我得到上面的代碼中增加了一個click事件處理程序「元素」，我只是不明白我是如何調用該函數自己從普通的舊的onClick =「」 ...

任何幫助非常讚賞

Danny

來源

2012-03-25 allnodcoms

您需要將click事件附加到元素。

http://api.jquery.com/click/

我會假設你的「按鈕」是一個鏈接。

HTML：

<div id="btnContainer"> 
    <a id="slideInfo" href="#">More Info</a> 
</div>

的jQuery：

$(function($) { 
    $('#slideInfo').click(function() { 
     api.playToggle(); 
    }); 
});

這是什麼，這是做什麼。首先，jQuery需要在頁面加載完成後運行。

$(function($) { 
    //Do this when page/DOM is done loading 
});

我們使用jQuery Selectors選擇具有slideInfo的ID的元素：與完成。我們將click事件處理程序附加到元素。在點擊處理程序內部，我們定義了一旦元素被點擊後我們想要執行的代碼。在這種情況下，我們想要切換幻燈片的播放。調用api.PlayToggle（）;超級插件的功能將做到這一點。

要記住的一件事是，這將暫停幻燈片放映，以便您可以顯示更多信息窗口。我不知道你如何顯示這個窗口，但我建議使用對話框彈出。一旦用戶關閉了這個對話框彈出窗口，你需要以某種方式再次調用api.playToggle（）函數來啓動幻燈片備份。如果您需要更多幫助，請回復更多信息。

我不完全確定你的第二個問題是什麼。我想你想要一個函數，當你點擊按鈕來觸發api.playToggle（）函數，但你也想在其他javascript/jquery代碼的其他地方調用該函數或者將它附加到另一個元素時調用。在這種情況下，你可能會考慮改變你的jQuery這樣的：

<script type="text/css"> 
    function ToggleSlideshow() { 
     api.playToggle(); 
    } 

    $(function($) { 
     $('#slideInfo').click(function() { 
      ToggleSlideshow(); 
     }); 
    }); 
</script>

我只是單純地創建了一個名爲ToggleSlideshow（）函數，將觸發api.playToggle（）函數。然後，當我附加我的點擊處理函數時，我告訴它觸發ToggleSlideshow（）函數。如果要將此附加到一個按鈕或類似的東西你必須做的onclick屬性是：

onClick="javascript:ToggleSlideShow()"

我希望我已經準確地回答你的問題。

來源

2012-05-17 19:46:36 Tom

我使用這個代碼，你的建議：

<script type="text/javascript"> 


$(function($) { 
    $('#slideInfo').click(function() { 
     api.playToggle(); 
    }); 
}); 

</script> 


<div id="btnContainer"> 
    <a id="slideInfo" href="#">More Info</a> 
</div>

要使用一個模式對話框暫停播放幻燈片。它工作完美！

但是，當我關閉模式框時，我無法重新啓動幻燈片。

我是否缺少一些額外的代碼？（你寫過以前的用戶問你是否是這種情況）。

非常感謝！t

來源

2012-07-17 20:50:18 Johann

通過點擊另一個元素暫停SuperSized.js

回答

相關問題