當視口可見指定元素時,由於元素對視口可見,頁面標題將會更改,但是如何根據標題更改標題一個除法根據分部標題更改頁面標題
This is the jsFiddle, Feel free copy paste it to try it tho
Live Viewing/Testing for Results
的「標題」(有些代碼是從GitHub庫「jQuery.isOnScreen」我不主張說,這是我的權利,但我試圖使用它並修改它爲我的網站,榮譽原始dev:D)
順便說一句,這裏是JavaScript代碼:
// This Gets the Article Title from a Division!
$.fn.is_on_screen = function(){
var win = $(window);
var viewport = {
top : win.scrollTop(),
left : win.scrollLeft()
};
viewport.right = viewport.left + win.width();
viewport.bottom = viewport.top + win.height();
var bounds = this.offset();
bounds.right = bounds.left + this.outerWidth();
bounds.bottom = bounds.top + this.outerHeight();
return (!(viewport.right < bounds.left || viewport.left > bounds.right || viewport.bottom < bounds.top || viewport.top > bounds.bottom));
};
if($('.target').length > 0) { // if target element exists in DOM
if($('.target').is_on_screen()) { // if target element is visible on screen after DOM loaded
document.title = "An Article"; // show this if visible
} else {
document.title = "Prospekt | A Gaming Community"; // show this if NOT visible
}
}
$(window).scroll(function(){ // bind window scroll event
if($('.target').length > 0) { // if target element exists in DOM
if($('.target').is_on_screen()) { // show this if it's visible to dom
document.title = 'It is Magic! | Stackoverflow'; // show this if visible
} else {
document.title = "Prospekt | A Gaming Community"; // show this if not visible
}
}
});
現在它的工作,非常感謝你!但這裏還有一個問題,如果我有3個「目標」,我怎麼才能使它工作,因爲javaScript只是檢測第一個目標,而不是其他目標:( – astroXoom
你好?你還活着嗎? – astroXoom
好吧,我一定會去的。 –