[TimberFloorAu]

See if this works now.

I have coded this now ( slightly differently on our forum ) But feel free to use this code change for adding dynamic videos using Modal.

This is a follow up to our Nag Screen.

Here is another example: FOR FRESH USERS ( you still need to upload content and colorbox folders !!!!! )

This MODALS a youtube link video dynamically on your Page

Open forumhome template

add this above </head>

<!--jquery modal-->
<link type="text/css" media="screen" rel="stylesheet" href="colorbox/colorbox.css" />
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
        <script type="text/javascript" src="colorbox/jquery.colorbox.js"></script>
<script type="text/javascript">
            $(document).ready(function(){
                //Examples of how to assign the ColorBox event to elements
                $("a[rel='example1']").colorbox();
                $("a[rel='example2']").colorbox({transition:"fade"});
                $("a[rel='example3']").colorbox({transition:"none", width:"75%", height:"75%"});
                $("a[rel='example4']").colorbox({slideshow:true});
                $(".example5").colorbox();
                $(".example6").colorbox({iframe:true, innerWidth:425, innerHeight:344});
                $(".example7").colorbox({width:"80%", height:"80%", iframe:true});
                $(".example8").colorbox({width:"50%", inline:true, href:"#inline_example1"});
                $(".example9").colorbox({
                    onOpen:function(){ alert('onOpen: colorbox is about to open'); },
                    onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); },
                    onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); },
                    onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); },
                    onClosed:function(){ alert('onClosed: colorbox has completely closed'); }
                });
                
                //Example of preserving a JavaScript event for inline calls.
                $("#click").click(function(){
                    $('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Open this window again and this message will still be here.");
                    return false;
                });
            });
        </script>
<!--jquery modal-->

Add this at bottom of footer

<!--Modal Box-->
<p><a class='example6' href="http://www.youtube.com/v/8k__7q3jRw8" title="vBulletin 4 - How to make a fixed style">vBulletin Tutorial</a></p>        
<!--Modal Box End-->

Click Vbulletin tuorial link bottom left

This link could be anywhere , navbar etc etc
Could be coded to add ajax inline , rather than iframe.

Whatever, but you cannot knock the fact this makes good sense, and looks wicked.

Anyhoo.. I cant spark peoples imaginations, I suppose they need to do that themselves.

---------- Post added at 06:58 AM ----- British Expats Australia----- Previous post was at 06:50 AM ----------

We will be adopting this system for tutorials and other link screens in main menu over the coming weeks. Currently link just below header, for weather widget