如何筛选以哈希链接为目标的2个jquery脚本
我在一个页面上有两个jquery脚本,它们都通过href=“#示例”指向站点链接。。 一个是内容滑块,另一个是用于“toTop”链接的“平滑滚动”。。 现在的问题是,每次我点击内容滑块导航的链接时,屏幕都会向上移动到滑块容器的顶部。我想避免这种情况。所以我尝试通过if语句过滤平滑滚动脚本,但到目前为止没有成功。。也许你有什么想法? 提前非常感谢 以下是平滑滚动jquery:如何筛选以哈希链接为目标的2个jquery脚本,jquery,filter,scroll,Jquery,Filter,Scroll,我在一个页面上有两个jquery脚本,它们都通过href=“#示例”指向站点链接。。 一个是内容滑块,另一个是用于“toTop”链接的“平滑滚动”。。 现在的问题是,每次我点击内容滑块导航的链接时,屏幕都会向上移动到滑块容器的顶部。我想避免这种情况。所以我尝试通过if语句过滤平滑滚动脚本,但到目前为止没有成功。。也许你有什么想法? 提前非常感谢 以下是平滑滚动jquery: $(document).ready(function() { $('a[href*=#]').bind("click",
$(document).ready(function() {
$('a[href*=#]').bind("click", function(event) {
event.preventDefault();
var ziel = $(this).attr("href");
if ($.browser.opera) {
var target = 'html';
}else{
var target = 'html,body';
}
$(target).animate({
scrollTop: $(ziel).offset().top
}, 1000 , function (){location.hash = ziel;});
});
return false;
});
这里是内容滑块的html:
<div id="Dienstleistungen">
<div class="left_column">
<h2>Meine Dienstleistungen</h2>
<h3>KOMPETENZEN</h3>
<ul id="AboutNav">
<li><h1><a href="#Kompetenzen" class="button1 active noScroll" rel="1" title="Frontend Entwicklung | Sebastian Böhme">Überblick</a></h1></li>
<li><h1><a href="#Frontend" class="button2 noScroll" rel="2" title="Frontend Entwicklung | Sebastian Böhme">Frontend Entwicklung</a></h1></li>
<li><h1><a href="#CMS" class="button3 noScroll" rel="3" title="Content Management Systeme & Online Shops | Sebastian Böhme">Content Management Systeme & Online Shops</a></h1></li>
<li><h1><a href="#SEO" class="button4 noScroll" rel="4" title="Suchmaschinenoptimierung (SEO) | Sebastian Böhme">Suchmaschinenoptimierung (SEO)</a></h1></li>
<li><h1><a href="#ScreenDesign" class="button5 noScroll" rel="5" title="Screen Design | Sebastian Böhme">Screen Design</a></h1></li>
<li><h1><a href="#Hand" class="button6 noScroll" rel="6" title="Alles aus einer Hand | Sebastian Böhme">Alles aus einer Hand</a></h1></li>
</ul>
</div>
<div class="container">
<div id="Kompetenzen" class="aboutContent right_columns">
<h1>Überblick</h1>
<p>Phasellus..</p>
</div>
<hr />
<div id="Frontend" class="aboutContent right_column ">
<h1>Frontend Entwicklung</h1>
<p>Phasellus..</p>
</div>
<hr />
<div id="CMS" class="aboutContent right_column ">
<h1>Content Management Systeme & Online Shops</h1>
<p>Phasellus..</p>
</div>
<hr />
<div id="SEO" class="aboutContent right_column ">
<h1>Suchmaschinenoptimierung (SEO)</h1>
<p>Phasellus..</p>
</div>
<hr />
<div id="ScreenDesign" class="aboutContent right_column ">
<h1>Screen Design</h1>
<p>Phasellus..</p>
</div>
<hr />
<div id="Hand" class="aboutContent right_column">
<h1>Alles aus einer Hand</h1>
<p>Curabitur..</p>
</div>
</div><!-- AboutSlider -->
</div><!-- Dienstleistungen -->
梅因·迪恩斯特莱斯通根
科姆皮滕森
前端肺
Phasellus
内容管理系统&;网上商店
Phasellus
这样的优化(SEO)
Phasellus
屏幕设计
Phasellus
好极了
库拉比图尔
Ü;伯布里克
Phasellus
我看到您的导航链接中添加了“noScroll”类,因此您可以根据该类进行筛选:
$('a[href*=#]')。而不是('.noscorl')
OT:一页中有几个H1-那太糟糕了!
您不应该在菜单中这样做,而在页面中应该是H2。完美!这正是我要找的。我试图重新构造这个“not”参数,不知道jquery中存在类似的东西。我需要更多地了解它……)非常感谢你!没有HTML规范,也没有搜索引擎开发人员说过在页面上使用多个
会有问题。只有标题的等级不应该被跳过,因为它会对文档结构的解释造成问题。
$(document).ready(function() {
$('a[href*=#]').not('.noScroll').bind("click", function(event) {
event.preventDefault();
var ziel = $(this).attr("href");
if ($.browser.opera) {
var target = 'html';
}else{
var target = 'html,body';
}
$(target).animate({
scrollTop: $(ziel).offset().top
}, 1000 , function (){location.hash = ziel;});
}); return false; });