Extension has now been updated to allow the use of more than one Gallery per site please read PDF file before posting questions regarding this.
Meets W3C Standards
Built with Extension Builder 2.6.0
Hoverbox Image Gallery is basically a super light-weight (8kb) roll-over photo gallery that uses nothing but CSS…It candisply as many or as little image you want to use in this extension version of script by Nathan Smith I saw a request for a gallery like this and knew of Hoverbox and thought it make a nice extension for anyone looking for a simple roll over effect gallery.
Kind permission has been granted by Nathan to allow me to port this over to WB5/6 you can visit his site here: http://sonspring.com/journal/hoverbox-image-gallery
and for a demo of what the gallery looks like you can visit Nathans gallery here: http://host.sonspring.com/hoverbox/
Finally thanks to Nathan for allowing me to port this over to WB5/6
Download is now avaiable via the Extension Manager for wb7.x.x
Meets W3C Standards
Last edited by BaconFries on Sun Sep 25, 2011 6:17 pm, edited 20 times in total.
Thx everyone had this one in mind for a while as a extension and saw that someone was looking for something similar asked the author for permission to use and well here it is..... again thx for compliments specials thx Nathan....
neo_webbuilder what do you not understand?? add images set the color of background set fontsize, fontfamily font color place were you want to display image gallery and thats it....
neo_webbuilder
I don't get it how this extension works !!!!
free2saute what do you mean by "When i preview it puts everything out of place" did you read the pdf that explained how to use....If you are using WB5 you need to manually change the doctype see pdf and original posting....and if you use WB6 you need to change the doctype in page properties to XHTML 1.0 Transitional. This was also mentioned in original posting by me if I can help I will.
Yes you can use larger images for this...with this extension it works by taking a large image Example: (600x300) and displays it at (150x75) and with the mouseover shows the original size (600x300) If you are asking is it possible to set the output size by itself no it is not possible. Please note that this is how the original script works by default as made by the original author I only take this and make into extension adding to it only to make it possible to change color, text etc....
Sorry this will be amended but you will not be able to increase the mouseover size only the thumb size as this is how the ccs works...it is the original size of image that determins what it will be displayed at.
BaconFries wrote:Sorry this will be amended but you will not be able to increase the mouseover size only the thumb size as this is how the ccs works...it is the original size of image that determins what it will be displayed at.
Thanks for your efforts but the size of the orignal image doesn't seem to make any difference to the size of the rollover image - And you can't add an url link to an image either?
Didn't know you.ve got angry...... I sais in the last sentence i found it..... it was my own mistake......
But please modify the z-index of the extension to above the menubar z-index..... otherwise the hoverbox photo will appear underneath the menubar if the hovebox is placed some where above the menubar.
neo_webbuilder me angry noooo sorry if it looked like that just asking what you were refering too thats all anyway new download available from first post added to the extension two variables for z-index as you requested done it this way so users can set z-index to what they need instead of having fixed in css file reason for two is one fix's IE the other is just for normal use of css
BaconFries wrote:neo_webbuilder me angry noooo sorry if it looked like that just asking what you were refering too thats all anyway new download available from first post added to the extension two variables for z-index as you requested done it this way so users can set z-index to what they need instead of having fixed in css file reason for two is one fix's IE the other is just for normal use of css
Wow Thanks mate !!!
First and second... it was my own stupidty not understanding that i had to link the original image id-frame to the hoverbox...... The pdf was not idiote proof i guess.
About the container...... I was wondering why not create a container in which you can just select the images as in the lightbox....... Although the hoverbox also works on text.....
Maybe its an idea for a new extension the image hoverbox... Just for images as the lightbox container.
I love this one found out that xhtml is required otherwise you get the yellow (or whatever color set) backgound banner. It was all in the pdf but sometimes reading seems to be difficult. Or maybe reading and understanding what the author wants to tell you.
I hate rapidshare myself for this but at the time of posting mediafire was down, or was up but not accepting uploads it back to normal so new mediafire link available in original posting. I will take a look at trying to impliment lightbox but the if you look at it it would just be another lightbox but I will look into it....
Could you please adjust the hoverbox tooltip with the z-index?
May i give some feedback to the gallery?
Further more i implemented the hoverbox gallery but i ran into a problem.
1. What if i don't have 20 pictures? I get the windows with the red cross in it.
2. Please keep aspect ratio in the hover over. Now the photo is stretched. This is not nice when the photo is not square in size.
3. is it possible to give the direction of the hover window. Starting at Left uppercorner down or right left conner at the bottom and then upwards left etc. etc. etc.
Ok the script I used was designed for twenty images so I just kept it to that..I did try to build it so user could insert as many or as little images as they choose to do so but it spoiled the layout and didnt function properly as it should. Now dont take this the wrong way I am no coder I only take what is available and make the best of it or try to make best of it to make it simpilar for users to add scripts to the pages without having to manually do so. You asked about the Hoverbox tooltip extension this was made by Eddy you can ask him if he can make the changes you need.
Answers to your questions
1.As I said the original script used twenty images so I just kept it that way you could manually remove any image holders you dont want from html I know it not want you want but it a solution.
2.Again with the original script it used a fixed height and width in css for thumbs 100x75 and a set height width for mouseover (preview)200x150 in css. It also used images that were of all the same size ie 200x150 landscape for both thumb and mouseover All I can sugest is you do not used portrait and landscape images in same gallery or you make all images the same size this will help to sort any distorting.
3.No I dont think this is possible as it wasnt part of the original script and as I said I am no coder so I wont be able to implement this sorry.
As always if I can help I will but if the script has limitations there really not much I can do...
No you should be able to preview by press F5 on keyboard or by going to File\Preview In Browser\Default Browser this should open like this
C:\Documents and Settings\JustMe\Local Settings\Temp\preview\index.html
OK, found that.
Now I am playing with a website in which all pages have a width of 800: I notice that the hoverbox (can check by changing its background color) nevertheless takes the full width of my screen and moreover it hides behind all other elements on the page.
I did a 'move to front' zillion times; changed the size of the hoverbox in its properties several times, but all in vain. What am I doing wrong here?
Have you used the Z-Order settings within the extension or are you using WB to set the z-order. In the extension you need to set both z-orders to a higher setting try setting each of the z-order to say 3000. If you still have a issue I will look into it......
No, I didn't fiddle with the z-index settings because I am previewing in Firefox and not on IE. However now I tried it in IE I see that the hoverbox disappears behind the menubar.
****Update**** ***Update***
This is a little Update user ofthe extension can now add as many or as little images to be displayed the previous version only allowed twenty images to be displyed at once. This update should make it easier to have the images you want to be displayed without any retrictions.
Hi it ok I understand your question I havnt see this before but I will look and see what the issue is with this. I will try and answer you as quickly as possible.
Can I ask are you using a Image for background or are you using a color?
If you find this hard to understand maybe fellow user Eddy can translate for us
Ok thanks for letting me know that it is a image you are using. I believe I know what the problem is and will fix this and upload a updated version for tomorrow if I can.
Have you enabled page center within WB Page Properties>General>Center Page>Center this page in the browser window horizontally.... The only changes I made to the css was to remove the background color line code so that you can use a image in WB so this wouldnt have effected the centering of extension I dont have the extension in WB at the moment so I cant rry it out to see why this happening with you, do you have a link/url I can view so I can take a look at html just to see what may be wrong I will get back to you on this later today monce I have tried in WB....
Evening rotgerus ok I have found what the problem is the hoverbox uses its own css file for the gallery body and it is this that is causing the problem with your page layout. The hoverbox CSS is set at a lower width than the main page... and the extension uses this width instead of the page width.... I will try and fix and upload a update as soon as I can right now I am ment to be resting due to illness but I will fix it.... If you are comfortable in modifying the CSS of hoverbox till I get a chance to fix it I can tell you what to look for in the file and what to change to suit page If you want to do this let me know either way I will try help as soon as I can.
Hi i-did-this mmm the alt tag has always worked from what I remember it was the title tag that wasnt in place in script.. it is possible to add url/link into script, as mentioned in post above I am recovering from a illness at moment and trying to rest up...I am also just trying to answer any questions relating to my extensions or helping out answering in forum were I can. I will endevour to try and make any fixes to extensions as soon as I can..... As I understand the extension works in preview just fine it could have been the poster had page set to php and hence it wouldnt show...
Hi no you havnt done anything wrong... this version of the extension was just to ensure that it is compatible with WB 6.5 and higher and to allow users to see what version of the extension builder that was used to build it with so that they know they can use in WB 6.5..... I know what you are refering to in the html and will try to get this added at sometime right now I am trying to test all my extension for WB 6.5 and rebuilding them if needed to meet the stricter html needed...
Thx for asking about how I am on the mend but still needing to take things slow mmmmm if I slow down any further I will be at a full stop
This can only be removed if you manually modify the main hoverbox css either before you upload to your server or once it has been uploaded, the only problem you will have with this is if you make any changes to the extension in your project you will need to repeat this each time you add new images in the extension as it will output the original css that is included in the extension....
can you convert you extension to work for WB7 Unicode . i try with EB Convert but no luck . is working perfect in standard WB 7 but needs convert for Unicode
Thanks in Advance
Maniz
this will be amended but you will not be able to increase the mouseover size only the thumb size as this is how the ccs works...it is the original size of image that determins what it will be displayed at.
mmmmm if I slow down any further I will be at a full stop 
