php - 垂直滚动站点中的 Div 内容页面标题

Question

使我的页面标题能够根据其所在的内容 div 区域进行更新的最简单方法是什么？

我有一个垂直滚动的网站，当用户导航到每个内容区域(内容区域在 div 和文章中)时，页面标题会发生变化

本质上，我试图保留“原始网站标题 | + 主页/关于等'

我在想我必须用 php 调用它来记住每个 div 链接的设置标题属性吗？有关设置的任何建议(如果可能)

Answer 1

我认为你应该看看 Viewport plugin .这样您就可以使用 4 个选择器:

$(":in-viewport")
$(":below-the-fold")
$(":above-the-top")
$(":left-of-screen")
$(":right-of-screen")

现在你可以这样做:

//Get the id of element(div) that is currently in view
var inview = $('div:in-viewport:first').attr('id');

//Define titles
if (inview == 'home'){

var newtitle = 'Home'

} else if (inview == 'about') {

var newtitle = 'About us'

} 

//Lets rename the page title
document.title = 'Orginal Site Title |' + newtitle;

上面的代码现在应该总是在你滚动时被调用 ($(window).scroll(function () { ... });) 根据 div 更新页面标题当前在 View 中。

这只是一个通用示例，完全可以根据您的需要进行更改。我希望它能以某种方式有所帮助。