Launch Thickbox onload Instead Of click
I want to launch a jquery thickbox onload instead of click. for this I use the code below.
<script language="javascript">
tb_show("HAI","#TB_inline?height=240&width=405&inlineId=hiddenModalContent&modal=true",null);
</script>
Actual link is
<a href="#TB_inline?height=240&开发者_运维问答amp;amp;width=405&inlineId=hiddenModalContent&
amp;modal=true" class="thickbox">Change Name</a>
When I click the above link..thick box appears..
but on body onload thick box is not appearing..
Please help regarding this..
Thanks in advance...
regards Yen
Your code should work. Maybe try putting it in a call to jQuery's document.ready e.g.
<script language="javascript">
$(document).ready(function() {
tb_show("HAI","#TB_inline?height=240&width=405&inlineId=hiddenModalContent&modal=true",null);
});
</script>
Uffff!!! Finally I have sorted it out, I think your div content is something like
<div id="hiddenModalContent" style="display:none">My Content</div>
Try this instead of the above one <div id="hiddenModalContent" style="display:none"><div>My Content</div></div>
This should fix the problem. Please note that you have to encapsulate the content in "hiddenModalContent" by an HTMl element e.g. <div>...</div><p>...</p> etc.
Because in thickbox.js file they have used .children() not .html(). This is the reason why we have to encapsulate the content.
If you have your anchor link somewhere on the page, you can do something like:
<script>
$.ready( function() {
$("#thickBoxLink").trigger("click");
}
</script>
<html>
<body>
<a href="#TB_inline?height=240&width=405&inlineId=hiddenModalContent&modal=true" id="thickBoxLink" class="thickbox">Change Name</a>
</body>
</html>
That should simulate clicking on the link and open up the thickbox for you when the page is loaded.
This is the same solution that Matt Frear suggested that you can copy and paste to test. I changed the thickbox parameters but you can change it as you want.
<html>
<head>
<link rel="stylesheet" type="text/css" media="screen" href="http://jquery.com/demo/thickbox/thickbox-code/thickbox.css" />
</head>
<body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
<script src="http://jquery.com/demo/thickbox/thickbox-code/thickbox-compressed.js" type="text/javascript"></script>
<script type='text/javascript'>
$(document).ready(function() {
tb_show('HAI','http://microsoft.com?KeepThis=true&TB_iframe=true&height=350&width=520');
});
</script>
</body>
</html>
加载中,请稍侯......
精彩评论