javascript - 单页网站和每个 div 一个不同的徽标？

Question

我想在我的单页网站http://goo.gl/16XdA的每个“页面”上都有一个不同的徽标（每个页面都有一个单独的 div）。有可能吗，怎么做？非常感谢

Answer 1

那个网站很好，我不明白为什么更改徽标对您来说很难。

这是一个简单的方法，有很多。

<li class=""><a onclick="changeLogo();" href="#team">Team</a></li>
<script type="javascript/text">
  function changeLogo(){
   var logoImg = document.getElementById("logo").children[0];
   logoImg.src = "newsource.jpg";
  }
</script>

我建议预先加载各种徽标，以便即时切换。

Answer 2

你有什么尝试？您可以在导航中添加事件：当用户单击导航项时，它会更改您当前的徽标...

像这样的东西

$('#nav li').click(function(){
   var selected = $('a', this).attr('href'); // This will return current item # like #team, #activities...
   #change your logo based on selected
   $('#logo img').attr('src', 'your url');
});

Answer 3

您可以使用 javascript 以多种方式执行此操作。我会使用 jQuery 在单击事件上移动精灵格式图像的背景位置，或者完全更改图像 url 的来源。另一种方法是将您的个人徽标添加到您要去的每个漂亮的动画背景中（如果您不介意将徽标制作为特定页面）。

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

Answer 4

您可以找到当前可见的 div

检查滚动后元素是否可见\

然后基于此在您的徽标 div 中设置图像。