Quantcast

navigation controls missing

classic Classic list List threaded Threaded
15 messages Options
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

navigation controls missing

teabag
Hi, I am not familiar with javascript except for cut and paste... I set up shadowbox and everything is fine, except it treats each image as individual image (i.e. not displaying controls). I have set the navigation controls to "true". How do you tell it to treat it as a gallery?

Here is the head of my document:

<script type="text/javascript" src="jquery.js"></script><script type="text/javascript" src="shadowbox-jquery.js"></script><script type="text/javascript" src="shadowbox.js"></script>
<script type="text/javascript" src="build/adapter/shadowbox-base.js"></script><script type="text/javascript" src="build/shadowbox.js"></script><script type="text/javascript"> Shadowbox.loadSkin('classic', 'src/skin'); Shadowbox.loadLanguage('en', 'build/lang'); Shadowbox.loadPlayer(['flv', 'html', 'iframe', 'img', 'qt', 'swf', 'wmp'], 'build/player'); window.onload = function(){ Shadowbox.init(); }; </script>    <script type="text/javascript"> $(window).load(function(){ var options = { handleOversize: 'drag', displayNav: true, handleUnsupported: 'remove', autoplayMovies: false }; Shadowbox.init(options); }); </script>
 
    <link href="src/skin/classic/skin.css" rel="stylesheet" type="text/css" />

What am I missing?
The links look as follows:
image1

Please help!
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: navigation controls missing

build
Go to :
http://www.mjijackson.com/shadowbox/doc/download.html

Select:
Adapter: jQuery
Language: English
Player: img

Click the build button and save the file; use it to replace the current shadowbox.js. and put this in your head.

<script type="text/javascript" src="jquery.js"></script><script type="text/javascript" src="build/shadowbox.js"></script><script type="text/javascript"> Shadowbox.loadSkin('classic', 'src/skin'); $(window).load(function(){ var options = { handleOversize: 'drag', // DO YOU NEED THIS? }; Shadowbox.init(options); }); </script>
The links look as follows:
<a href="images/strata.jpg" rel="shadowbox[galleryname]" title="Strata"><img src="thumbnails/strata.jpg" alt="image1" width="73" height="73" /></a>

Notice the [] square brackets in the link above!

Please post a link to an online example if you have further problems.

beers,
build

Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: navigation controls missing

teabag
I tried, now it does not work at all. http://test.masharyskin.com/installations1.html
The one that was almost working is http://test.masharyskin.com/installations.html

Sorry, I must not be doing something right.
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: navigation controls missing

build
THe example helps a lot.
The reason it does not work is because you have not followed my instructions !

This:

<script type="text/javascript" src="shadowbox-jquery.js"></script>  <script type="text/javascript" src="build/shadowbox.js"></script>  <script type="text/javascript"> <script type="text/javascript" src="build/adapter/shadowbox-base.js"></script>  <script type="text/javascript" src="build/shadowbox.js"></script>  <script type="text/javascript"> Shadowbox.loadSkin('classic', 'src/skin'); window.onload = function(){ var options = { handleOversize: 'drag', displayNav: true, handleUnsupported: 'remove', autoplayMovies: false }; Shadowbox.init(options); }); </script>
is very different to what I posted.

Also note you cannot have TWO window.onload events.

beers,
build
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: navigation controls missing

teabag
Sorry, it didn't upload right the first time. Now it is exactly as you said.
The controls are still missing!
http://test.masharyskin.com/installations1.html

Thanks for your help, I hope it works eventually! When you talk about the two window.onload events - are you referring to the navigation panel? How can I rectify it?

Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: navigation controls missing

build
It's working now. Leave the navigation panel as it is.

You only have one item in the gallery so the navigation controls will not load. If you add another image to the gallery the navigation controls will load.

Add rel="shadowbox[strata]" to every link you want in that gallery.

beers,
build
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: navigation controls missing

teabag
Aaaah! Thank you!!!!!! Sorry for being an idiot.
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: navigation controls missing

build
In reply to this post by build
BTW,
I like a clean design in pages, well done on the graphic design.
Could you could help me with this?
http://www.ariel.org.au/page.php
it's not too bad but I'd like it to look a bit more .... stylish.

beers,
build
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: navigation controls missing

teabag
Sure, gladly! Let me look at it and I'll email you today.
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: navigation controls missing

teabag
In reply to this post by build
Hi,
Just a couple of things; I'd make the background hovers of the menu items a uniform width. Also, maybe yellow letters on green background is a bit grating, so maybe they can just flip and become whit.

As far as content, I'd make the second heading slightly smaller than the first one, and make the text a bit lighter so it does not compete with the navigation and does not crowd the page so much. You may also increase the whitespace between the navigation and the content, but perhaps making the text lighter will take care of the crowding.

Does this help?
cheers!
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: navigation controls missing

build
G'day,
Thank you for your excellent suggestions.

I am having trouble with making the background hovers of the menu items a uniform width.
display block give weirdness.

Could you pm me with your email address as this is Off-Topic.

Many Thanks,
build
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: navigation controls missing

teabag
mryskin@gmail.com.

If you write me there we can discuss it.
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: navigation controls missing

Nerone
In reply to this post by teabag
but on IE7 it doesn't work for me
runs fine on firefox and iron/chrome

i was using this code
on ff it's ok
on IE returns me an error but loads without the options i've set
as build said i assume doesn't work because of the double command
but then how should it work correctly on both browsers?

<script type="text/javascript"> Shadowbox.loadSkin('classic', 'js/skin'); window.onload = Shadowbox.init; </script><script type="text/javascript"> $(window).load(function(){ var options = { counterType: 'skip', animate: 'false', animSequence: 'sync', resizeDuration: '0.3', }; Shadowbox.init(options); }); </script>

thanks anyway build for your precious help ;)
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: navigation controls missing

John B.
I am having the same issue on IE7 except I am launching shadowbox from Flash. Opera, Firefox, and Chrome all display shadowbox correctly. I just can't figure out why it doesn't launch in IE7?!?!
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: navigation controls missing

mars
In reply to this post by teabag
thanks for help..really appreciate.
Loading...