[asp.net]来访之间转换

发布时间: 2017/3/26 4:48:42
注意事项: 本文中文内容可能为机器翻译,如要查看英文原文请点击上面连接.

我想要有来访像幻灯片之间的过渡效果、 旋转、 褪色等。 我试图做到这一点与下面的代码,但它不工作。 有什么想法?

$("asp:HyperLink.smoothlink").click(function (e) {
    $("body").addclass("fadeout");

    setTimeOut(function() {
        window.location = e.currentTarget.attributes['data-url'].value;
    },1000);
}

CSS

.fadeout
{
    opacity:0;
    transition :opacity 1s ease-in-out;
    -moz-transition-opacity 1s ease-in-out;
    -webkit-transition:opacity 1s ease-in-out;
}

解决方法 1:

就我所知,您正试图将动画添加到您的当前页面,当你点击一个特定的链接。看来,你在.NET 环境中工作,我不太熟悉其 WebControls,然而错误几站出来︰

  • 使用的不适当的选择器字符串- asp:HyperLink.smoothlink 。请尝试使用 a.smoothlink 相反。
  • JavaScript 是区分大小写所以 addclass 和 ' 比如 are causing an error. Try using 'addClasssetTimeout 相反。
  • 你也可能需要使用 href 属性相反 data-url ,但这真的取决于什么是.Net 控件生成。

这里是的我认为你想做一个工作示例︰

HTML:

<a href="http://stackoverflow.com" class="smoothlink">example link</a>

CSS:

.fadeout {
    opacity:0;
    transition :opacity 1s ease-in-out;
    -moz-transition-opacity 1s ease-in-out;
    -webkit-transition:opacity 1s ease-in-out;
}

JavaScript:

$(document).ready(function () {
    $("a.smoothlink").click(function (event) {
        event.stopPropagation();
        $("body").addClass("fadeout");
        setTimeout(function () {
            window.location =  $(event.currentTarget).attr('href');
        }, 1000);
    });
});
官方微信
官方QQ群
31647020