Show Thread Enhancements - CSS Image Resize with Preview

Don't forget to click install if you use this!

Nix's CSS Image Resize with Hover Preview

Not Ready for a live site. Next release will address all the issues.

Credits:
Based of this Hoverbox by Nathan Smith
http://sonspring.com/journal/hoverbox-image-gallery

This mod will resize images posted on your forum and create a thumbnail with an hover preview all with CSS.

Tested on Firefox, Safari and IE 6.

So why is this not in the template section? I got some ideas that i'll be adding on to this. This is just to get it out there.


How to install?

1. Import the product
2. Coppy the CSS to your additional CSS section
3. Go into the BBCode manager and find the new bbcode it made. Edit it and just save it. (not sure why its doing that but i'll try and fix this)
4. Post an image!



CSS to add:

.hdiv {
clear:both;
}

.hdclear {
clear:both;
}

.hoverbox {
cursor:default;
list-style:none;
}

.hoverbox a {
cursor:default;
}

.hoverbox a .preview {
display:none;
}

.hoverbox a:hover .preview {
display:block;
position:absolute;
top:-33px;
left:-45px;
z-index:1;
}

.hoverbox img {
background:#fff;
color:inherit;
vertical-align:top;
width:150px;
height:112px;
border-color:#aaa #ccc #ddd #bbb;
border-style:solid;
border-width:1px;
padding:2px;
}

.hoverbox li {
background:#eee;
color:inherit;
display:inline;
float:left;
position:relative;
border-color:#ddd #bbb #aaa #ccc;
border-style:solid;
border-width:1px;
margin:3px;
padding:5px;
}

.hoverbox .preview {
width:350px;
height:263px;
border-color:#000;
}

Versions:

1.0 - First release


Planned Features

- Guest or usergroups the admin picks will get a predetermined message in the hover popup. (option)
- Enable it for attachments (option for on or off)
- Have GD2 create a thumbnail and chache it (option for on or off)

There will also just be the basic version of thats all you want.

Know Bugs
I'm sure they will come!

SS coming!

[nix]

I'm working on it now. Some time in the next couple of days I would guess.

[Gooner]

Well, nice idea but this script has just totally messed my site up, i installed it and i didnt like it, so i uninstalled the mod and removed the css code i added, and now no images will work at all... every image on my forums says...

[x] <---- and a box with a red X

Ive undone everything i did and its messed up.

[nix]

go back into ur bbcode manager and see if the bbcode for it is still there. If it is delete it. If its not, go into another bbcode and just edit it and hit save without making changes. Sorry for the trouble. The next version will be better.

[Gooner]

thanks, fixed

[nix]

Np. I'll have a version out tomorrow or Sat that will fix most of the problems. I think you'll like it.

[Seiyaboy]

Does this mod only work on [img] tag'd images? I hope it also works for attachments as well.

[nix]

right now it only works in IMG tags. I'll be adding attachments after the next release.

[GrendelKhan{TSU]

yikes. installed then had to uninstall.

gunna wait for the new version... REALLY need the only affects images bigger that certain setting. (makes things crazy if people have bbcode img signatures !) )

[nix]

Yea. Thats why I moved it to beta. Right now its not ready for a live site.

[daystorm]

Hello,

I installed this and am testing it on IE6. When I input an image, sometimes it does the hover and sometimes it does not. I have to refresh the page for the hover to work, unfortunately, when it does work it does not go back to normal size, it stays large until I refresh the page again. Any suggestions as to why this is happening?