CSS Image Resize with Preview
Mod Version: .7, by nix
This modification is in the archives.
| vB Version: 3.6.x | Rating:  (7 votes - 4.57 average) |
Installs: 58 |
| Released: 26 Jun 2007 | Last Update: 26 Jun 2007 | Downloads: 789 |
 Not Supported
 DB Changes
Is in Beta Stage
|
||
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:
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'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:
Code:
.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!
Download
This modification is archived, downloads are still allowed.
product-nix_hover.xml (1.3 KB, 409 downloads)
install.txt (1,013 Bytes, 408 downloads)