我有这段代码:
if (Page.IsPostBack)
{
Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "Javascript", "alert('test');jQuery('html, body').animate({ scrollTop: jQuery('.newslettersubscribe').position().top }, 'slow');",true);
}
我不明白为什么滚动到页面底部的div不起作用。
请注意alert('test')
正在出现......
我确实在页面上有一个班级newslettersubscribe
的div。
更新: - 使用脚本管理器加载我的js文件:
<asp:ScriptManager ID="ScriptManager1" runat="server" >
<Scripts>
<asp:ScriptReference Path="~/js/jquery-1.4.2.min.js" />
<asp:ScriptReference Path="~/js/cufon-yui.js" />
<asp:ScriptReference Path="~/js/helvetica_neue.js" />
<asp:ScriptReference Path="~/js/jquery.cycle.all.js" />
<asp:ScriptReference Path="~/js/default.js" />
<asp:ScriptReference Path="~/js/swfobject-2.1.js" />
</Scripts>
</asp:ScriptManager>
所以我需要找到一种在加载这些外部js文件后运行这个内联脚本的方法......
更新2 :在与dknaack聊天讨论后,我们发现position
也存在问题。我在他的推荐下用offset
替换了,现在它正在工作!!!
非常感谢 dknaack !
答案 0 :(得分:3)
我已经尝试过您的代码了。
问题是你不要等到DOM
满载。
将您的RegisterClientScriptBlock
更改为此。
Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "Javascript", "alert('test');jQuery(function(){jQuery('html, body').animate({ scrollTop: jQuery('.newslettersubscribe').position().top }, 'slow');});", true);
确保您的jQuery<version>.js
文件高于您的脚本。看看你加载的页面的Html源代码。您应该将jQuery文件添加到站点管理员的<head>
部分。
答案 1 :(得分:2)
string jsScript1 = @"
jQuery(function () {
alert('test');
jQuery('html, body')
.animate({ scrollTop: jQuery('.newslettersubscribe').position().top }, 'slow');
});"
if (Page.IsPostBack)
{
Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "Javascript", jsScript1,true);
}
尝试在C#代码中使用漂亮的js,也需要在DOM完成加载后运行此动画 - 通过将函数传递给jQuery()
来执行此操作答案 2 :(得分:0)
我看到两个问题。首先,您可能希望使用ScriptManager.RegisterStartupScript
而不是Page.RegisterClientScriptBlock
。这会将您的脚本放在页面底部而不是顶部。脚本块更适用于您希望在以后调用的页面上放置的函数。
正如其他答案所提到的,第二个是你应该将动画代码包装在某个客户端生命周期事件中。你可以像这样挂钩jQuery的ready
事件:
jQuery(function() { /* Your Code */ });
当DOM准备好被操作时,但在页面实际完成加载之前,将执行您的代码。如果你想等到页面加载完毕,你可以这样做:
jQuery(window).load(function() { /* Your Code */ });