|
linking to a slide show
Here we offer some bonus HTML tips to help you build links to your jClicker slide shows, namely how to have your slide shows open in their own window.
Let's assume on your web site you have a directory with your main HTML files and sub directory named show that holds your jClicker slide show files:
 blah.html
somefile.html
home.html
... ... ...
 show
index.html
clicker.html
... ... ...
To create a link from any file in your main directory, say blah.html, to your slide show, you are linking to the index.html file inside the show directory.
The basic link syntax is to write it as:
<a href="show/index.html">See my Slide Show</a>
This will create a link that opens in the same window as your blah.html file (Try this example). Viewers of your slide show can return to the blah.html page by using the "return" button in the jClicker.
To make your slide show open in a new web browser window, you can write your link as:
<a href="show/index2.html" target="_blank">See my Slide Show</a>
Now when the See my Slide Show link is clicked, your slide show will open in a second web browser window. When clicked, the jClicker "return" button will close this window, revealing your blah.html page. (Try this example)
But wait! There is more. You can not only open your slide show in a new window, you can have it fill the computer screen and leave off the web browser buttons to maximize the space for your slide show. This will take a bit more work...
First, in your blah.html file, you will have to add some JavaScript code that tells the web browser how to open the window. You must put this exact code inside the <HEAD>...</HEAD> portion at the top of your blah.html file:
| JavaScript Code |
<script language="javascript">
<!--
function showFullScreen(url) {
if (window.screen) {
w = screen.availWidth; h = screen.availHeight - 45;
} else {
w = 640; h = 480;
}
bigshow = window.open( url, 'ext',
'status,resizable,top=0,left=0,screenX=0, screenY=0,width='
+ w + ',height=' + h);
if (window.focus) {bigshow.focus()}
}
// -->
</script>
|
Now you can create a link that will not only open your slide show in a new window, but will make that window as large as possible and maximize the screen space for your slides:
<a href="show/index.html" onClick="showFullScreen('show/index.html'); return false">See my Slide Show</a>
See how it works for yourself! Try this example.
NOTE: If you are unsure of your HTML editing skills, we recommend our Writing HTML tutorial.
Next:
This is pretty much all of the steps you need to know to use the jClicker. The next phase might by called "Son of jClicker" or how to assemble a collection of multiple jClicker slide shows into in a single site. Go!...
|
