dyadica.net

Ok so im finally going to tie down the thickbox presentation of both shockwave and video content:

Above you will find a little particle demo done in lingo (I hope).

For those of you in the know its supposed to be smoke done in Windwaker style. Personaly im quite hapy with the result. If all goes well by clicking on the image a thickbox should open with the demo in it.

Issues I have been having includes getting the movies to show full screen but I think I have nailed this now. I have also included a standard text link to the same content, calling via page id this time for testing purposes.

shockwave: Zelda Smoke

Read..

thickbox test here

So far so good (finally) however there seems to be an issue culling shockwave content within a mozilla based browser, must address asap.

Cody Lindley has released a new version of thickbox (3.0)

Im hoping that this will address the issues that I have been having here at dyadica.net with the use of Iframe content and mozilla based browsers. It seems that whilst IE alows direct usage of a .dcr or .dir but when in mozilla browsers correct object embed must be used. This calls for additional pages to be created to house the content. Er KUDOS to IE then.

So today I commence on converting thickBox 3.0 to be mootools compatible, keeping in mind thoughts that wordpress will soon run of jQuery. Hopefully conversion will adhere to the methods for 2.0 as detailed here.

Resources:

thickBox 3.0, official home:Â http://jquery.com/demo/thickbox/
cody Lindley permalink: http://codylindley.com/Webdev/321/thickbox-3

mooTools compatability: http://docs.jquery.com/Using_jQuery_with_Other_LibrariesÂ

having a few issues with theme revamp and mozill based browsers in regards to thickbox

A little iFrame image example: here

A little iFrame .dcr example: here

A little iFrame .direxample: here

test via thickbox

To attatch to theme header:

<script src="<?php bloginfo('stylesheet_directory'); ?>/js/jquery.js" type="text/javascript"></script>

To redefine the $ shortType, more info here.
<script type="text/javascript"> var $j = jQuery.noConflict(); </script>

Modd your jquery script to use the new short eg. $j and embed:
<script src="<?php bloginfo('stylesheet_directory'); ?>/js/thickbox.js" type="text/javascript"></script>

test via jtip

wpcf3.zip

2. thickBox & jQuery

With the simple embed of .dir/dcr content sorted my thoughts then turned to more advanced presentation of content.

Within my adventures, navigating the dyadic sea I came across a great little app produced by cody Lindley utilising the jQuery function set called thickBox. I have used thickBox on previous works and love both its simplicity and functionality.

To my delight with a little google play I discovered two ports already in existance for thickBox use within wordpress produced by dan Atkinson, which can be detailed as follows:

jQuery for wordPress:
http://www.dan-atkinson.com/blog/index.php/jquery-111-for-wordpress/

thickBox for wordPress:
http://dan-atkinson.com/blog/index.php/thickbox-plugin-for-wordpress/

Examples for usage:

Linking to http://www.example.com/index.html (with a thickbox window height of 400, and a width of 500):

<a href=”http://www.example.com/index.html?height=400&width=500″ title=”Example Index” class=”thickbox””>A Link to Example.com</a>

Linking to http://www.example.com/image.jpeg:

<a href=”http://www.example.com/image.jpeg” title=”A wonderful image” class=”thickbox”>text or image</a>

A few live examples:

A little iFrame shockwave example: here
A standard shockwave example: here