- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我想向下滚动到 angularjs 中的一个部分,当我使用 href 标签时,它会导航到下一页。有什么办法可以做到这一点吗?
<ul>
<li><a href="#section-1" target="_self" du-smooth-scroll du-scrollspy>Section 1</a></li>
<li><a href="#section-2" target="_self" du-smooth-scroll du-scrollspy>Section 2</a></li>
<li><a href="#section-3" target="_self" du-smooth-scroll du-scrollspy>Section 2</a></li>
<li><a href="#section-4" target="_self" du-smooth-scroll du-scrollspy>Section 2</a></li>
<li><a du-smooth-scroll="section-3" du-scrollspy>Section 3</a></li>
<li><a href="http://github.com/oblador/angular-scroll/">Project on Github</a></li>
</ul>
HTML
<section id="section-1">
<h2>Section 1</h2>
<p>Bacon ipsum dolor sit amet sausage tail capicola ground round hamburger ham hock. Short ribs pig andouille meatball, pastrami tri-tip fatback ham hock shank kielbasa swine. Rump pancetta jerky kielbasa doner beef ribs tongue hamburger strip steak drumstick andouille shoulder shank flank. Swine drumstick meatball pig beef sausage strip steak.</p>
<img src="http://lorempixel.com/1000/500/" alt="" />
</section>
<section name="section-2">
<h2>Section 2</h2>
<p>Bacon strip steak ground round, tongue pastrami short ribs pork chop venison turducken sausage sirloin. Flank chicken pork chop capicola turkey turducken cow pork loin biltong meatball drumstick pancetta filet mignon ground round fatback. Ham hock jerky short ribs brisket. Meatloaf shoulder pork chop capicola, sirloin swine pig pork. Jerky ribeye hamburger pork loin sirloin kevin bresaola boudin chuck flank. Ham hock pork belly chicken jerky rump bresaola.</p>
</section>
<section id="section-3">
<h2>Section 3</h2>
<p>Shank fatback pastrami short loin, turkey jowl kielbasa ribeye chicken jerky drumstick flank ham. Swine shankle pork belly kielbasa shoulder flank jowl, sirloin doner. Kevin tri-tip bresaola leberkas. Swine ball tip cow strip steak. Ham filet mignon pork chop, pork fatback andouille pork loin shoulder jowl swine strip steak turducken prosciutto rump.</p>
<img src="http://lorempixel.com/1000/400/" alt="" />
<p>Tongue tri-tip pastrami, shoulder rump pork belly ground round. Ham hock chuck leberkas doner, strip steak corned beef tri-tip capicola. Rump turkey ham sausage shankle. Flank shankle pork chop ham hock. Shankle venison kielbasa, pancetta swine beef ball tip t-bone bacon hamburger ground round ribeye flank. Turducken bacon bresaola, chicken kevin boudin ball tip strip steak filet mignon pork turkey shank ground round. Kielbasa fatback prosciutto pork chop, jerky ground round leberkas boudin ball tip beef shankle shoulder swine brisket.</p>
</section>
<section id="section-4">
<h2>Section 4</h2>
<img src="http://lorempixel.com/1000/600/" alt="" />
<p>Shoulder cow tenderloin chuck, pork chop jerky doner leberkas. Chuck sausage hamburger, kevin beef pork chop pork shoulder ground round ball tip turducken flank. Bresaola tri-tip meatloaf, salami venison tail pig shank shankle jowl sausage brisket cow biltong turducken. Swine turducken hamburger ball tip short loin prosciutto kevin jowl tri-tip. Doner meatloaf pork brisket.</p>
</section>
<footer>
<button ng-click="toTheTop()">Take me back!</button> or <button ng-click="toSection3()">To section 3</button>
</footer>
</div>
和我的 Controller
sidemenu.controller('unitTypeCtrl', ['$scope', '$rootScope', '$location', '$http', 'allServices','$document','PropertyDetails','$routeParams','$window','typeServices','$location', '$anchorScroll', function (a, b, c, d, e,f,h,r,w,t,l,s) {
b.contactwdgt="";
b.header = true;
b.homepage = false;
b.filter = false;
b.innerHeader = "inner-page-hdr";
a.composite=false;
a.groupProp=[];
a.gridView="";
a.listclass="prprt-list-ctr row";
a.view="true";
a.toTheTop = function() {
f.scrollTopAnimated(0, 5000).then(function() {
console && console.log('You just scrolled to the top!');
});
}
var section3 = angular.element(document.getElementById('section-3'));
a.toSection3 = function() {
f.scrollToElementAnimated(section3);
}
}]);
最佳答案
angular.module('myApp', ['duScroll']).
controller('MyCtrl', function($scope, $document){
$scope.toTheTop = function() {
$document.scrollTopAnimated(0, 5000).then(function() {
console && console.log('You just scrolled to the top!');
});
}
var section3 = angular.element(document.getElementById('section-3'));
$scope.toSection3 = function() {
$document.scrollToElementAnimated(section3);
}
}
).value('duScrollOffset', 30);
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js"></script>
<script src="http://oblador.github.io/angular-scroll/angular-scroll.min.js"></script>
<body ng-app="myApp" ng-controller="MyCtrl">
<ul>
<li><a href="#section-1" du-smooth-scroll du-scrollspy>Section 1</a></li>
<li><a href="#section-2" du-smooth-scroll du-scrollspy>Section 2</a></li>
<li><a href="#section-3" du-smooth-scroll du-scrollspy>Section 3</a></li>
<li><a href="#section-4" du-smooth-scroll du-scrollspy>Section 4</a></li>
<li><a href="#section-3" du-smooth-scroll="section-3" du-scrollspy>Section 3</a></li>
<li><a href="http://github.com/oblador/angular-scroll/">Project on Github</a></li>
</ul>
<div>
<section id="section-1">
<h2>Section 1</h2>
<p>Bacon ipsum dolor sit amet sausage tail capicola ground round hamburger ham hock. Short ribs pig andouille meatball, pastrami tri-tip fatback ham hock shank kielbasa swine. Rump pancetta jerky kielbasa doner beef ribs tongue hamburger strip steak drumstick andouille shoulder shank flank. Swine drumstick meatball pig beef sausage strip steak.</p>
<img src="http://lorempixel.com/1000/500/" alt="" />
</section>
<section id="section-2">
<h2>Section 2</h2>
<p>Bacon strip steak ground round, tongue pastrami short ribs pork chop venison turducken sausage sirloin. Flank chicken pork chop capicola turkey turducken cow pork loin biltong meatball drumstick pancetta filet mignon ground round fatback. Ham hock jerky short ribs brisket. Meatloaf shoulder pork chop capicola, sirloin swine pig pork. Jerky ribeye hamburger pork loin sirloin kevin bresaola boudin chuck flank. Ham hock pork belly chicken jerky rump bresaola.</p>
</section>
<section id="section-3">
<h2>Section 3</h2>
<p>Shank fatback pastrami short loin, turkey jowl kielbasa ribeye chicken jerky drumstick flank ham. Swine shankle pork belly kielbasa shoulder flank jowl, sirloin doner. Kevin tri-tip bresaola leberkas. Swine ball tip cow strip steak. Ham filet mignon pork chop, pork fatback andouille pork loin shoulder jowl swine strip steak turducken prosciutto rump.</p>
<img src="http://lorempixel.com/1000/400/" alt="" />
<p>Tongue tri-tip pastrami, shoulder rump pork belly ground round. Ham hock chuck leberkas doner, strip steak corned beef tri-tip capicola. Rump turkey ham sausage shankle. Flank shankle pork chop ham hock. Shankle venison kielbasa, pancetta swine beef ball tip t-bone bacon hamburger ground round ribeye flank. Turducken bacon bresaola, chicken kevin boudin ball tip strip steak filet mignon pork turkey shank ground round. Kielbasa fatback prosciutto pork chop, jerky ground round leberkas boudin ball tip beef shankle shoulder swine brisket.</p>
</section>
<section id="section-4">
<h2>Section 4</h2>
<img src="http://lorempixel.com/1000/600/" alt="" />
<p>Shoulder cow tenderloin chuck, pork chop jerky doner leberkas. Chuck sausage hamburger, kevin beef pork chop pork shoulder ground round ball tip turducken flank. Bresaola tri-tip meatloaf, salami venison tail pig shank shankle jowl sausage brisket cow biltong turducken. Swine turducken hamburger ball tip short loin prosciutto kevin jowl tri-tip. Doner meatloaf pork brisket.</p>
</section>
<footer>
<button ng-click="toTheTop()">Take me back!</button> or <button ng-click="toSection3()">To section 3</button>
</footer>
</div>
</body>
关于javascript - 目标 ='_self ' 无法正常工作?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39971711/
在插入某些带有滚动条的 jQuery DIV 滚动条后,我花了 2 天的时间修复了故障 href="" 链接。 我在这些 DIV 中有 href="" 链接,单击它们但浏览器没有执行任何操作,无论它们
此代码将 href 加载到新窗口并加载到 self 中,这是为什么?不应返回 false;停止默认点击? //get links in paragraphs var first_p = $$('#cl
什么时候 _self frame target变得有用或值得使用它? 这不是(总是?)默认行为吗? 最佳答案 可以使用 更改默认值 中的标签: 在这种情况下,您可以使用 target="_self
在哪里记录了该关键字的存在? (我想这是一个常量,而不是一个对象,对吗?)。 无论如何,我想知道它的记录位置,看看是否还有其他我不知道的关键字。 谢谢 最佳答案 这并不能真正回答问题,但是我认为必须提
我有一个从 Document 类继承的类来访问 Resource 类属性。 public class UserProducts : Document { public string Id {
我在这里和那里看到过这个,但找不到关于这个“东西”的任何信息。任何人都可以向我们提供一些有关#_self 提议的信息吗? 最佳答案 将跳转到 ID 为 _self 的元素在当前页面。 例如,在页面下方
我有我的 Angular Directive(指令),这是一些 div 周围有一个 但是当我点击 div 时它不会重新加载我的页面。 我做错了什么吗? 这是完整的指令
我怎样才能使所有链接通过 jQuery 或 javascript 具有相同的“_self”目标? 最佳答案 把它放在 中: 无需 JavaScript - HTML 具有内置功能! 关于javas
我有一个 View ,我试图根据 http://symfony.com/doc/current/cookbook/form/form_customization.html#how-to-customi
我想向下滚动到 angularjs 中的一个部分,当我使用 href 标签时,它会导航到下一页。有什么办法可以做到这一点吗? Section 1 Section 2 Sect
我的问题是: 当我使用时: window.open("example.com","_self"); 或 self.open("example.com"); 或 window.location.href
请看我下面的js函数。如果我在没有 _self 属性的情况下进行重定向,该函数工作正常。此外,无论我做了什么,它都不会停止页面本身的重定向,我认为这就是为什么 _self 无法正常工作并且可以正常用于
我正在使用 php 制作一些网页,但我在尝试制作链接时遇到了一些困难。 基本上我有我的 在其上设置 target="_self"以使其保持在同一页面上。 (请注意该页面是一个新窗口,我也尝试使用“_t
围绕这个修改有一个 href 应该在同一窗口中打开链接,但这不会发生。打开此链接的唯一方法是添加 target="_blank"反而。 如何解决? .centered { position: ab
我在我的应用程序中使用 Modernizr,并且它以某种方式转换来自 的链接 至 . 我想要在同一窗口中打开一些链接,即使它们转到不同的域。 以下是我正在使用的 Modernizr 的功能: Buil
我尝试在我的网站上使用 Facebook 注册插件的 iframe 版本,但在重定向目标方面遇到问题。 在我的网站上,页面中间有一个 iframe;当用户单击“注册”时,我希望 iframe 导航到r
所以我想知道如何编写一个按钮来打开 2 个网址。我看到 Retailmenot.com 在点击“获取优惠”按钮时会这样做。它会打开一个新选项卡,其中包含他们自己网站内的文章,但在原始选项卡上会打开指向
下面的 Javascript 函数用一些新文本替换当前窗口的内容,还添加了一个按钮,使用户能够返回到以前的内容。这在 FF 和 IE 中有效,但在 Chrome 中无效,Chrome 显然不会将新内容
正如标题所说,我正在尝试为 inAppBrowser 插件创建目标 _self 以在 phonegap webview 中打开外部链接。但目前它改为在 inAppBrowser 中打开。 我正在使用这
我想使用 Azure 在 DocumentDB 中创建集合。我写了一个代码,但在执行时会抛出一个错误,指出“无法读取未定义的属性‘_self’”。下面是我的代码,请任何人查看我的代码并帮助我。 app
我是一名优秀的程序员,十分优秀!