vb.org Archive
Page 1 of 8 1 23 Last »
Show 40 post(s) from this thread on one page

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   vBulletin 3.6 Add-ons (https://vborg.vbsupport.ru/forumdisplay.php?f=194)
-   -   Show Thread Enhancements - CSS Image Resize with Preview (https://vborg.vbsupport.ru/showthread.php?t=150675)

nix 06-25-2007 10:00 PM
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:
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!

nix 06-26-2007 04:11 AM
Before

http://www.dev-nix.com/cssresize/css1.gif

After:

http://www.dev-nix.com/cssresize/Picture%205.png

Hover:
http://www.dev-nix.com/cssresize/Picture%206.png

I know the SS are hard to tell what it does. I'll try and put up a demo in a bit.

shadowevil 06-26-2007 05:05 AM
nice mod ....*installed*

Aligator21 06-26-2007 05:09 AM
does this works also into 3.6.2?

nix 06-26-2007 05:29 AM
Yea should work on all version. Its just bbcode and CSS right now.

4x4 Mecca 06-26-2007 05:36 AM
Any chance of a demo site? I see the pictures, but a real life demo would really help.

shadowevil 06-26-2007 05:40 AM
It's not working.

Demo:
https://vborg.vbsupport.ru/

Nix help me :((

4x4 Mecca 06-26-2007 05:54 AM
I have mine working on a test site, but why does it show them on seperate lines, anyway to do them inline?

nix 06-26-2007 05:56 AM
Quote:
Originally Posted by shadowevil (Post 1276693)
It's not working.

Demo:
http://img408.imageshack.us/img408/3295/errorrk8.png

Nix help me :((
Go into our bbcode manage and click on edit for the bbcode i created. Then just save it. Not sure why its doing this but I'll look to fix it.

Quote:
Originally Posted by 4x4 Mecca (Post 1276698)
I have mine working on a test site here http://www.gettin-dirty.com/showthread.php?p=1#post1 but why does it show them on seperate lines, anyway to do them inline?
Yea thats one of the features I would like to make it do. Kind of make them like a gallery. I might have a javascript version also for people who don't mind that.

Also. I noticed it affects sigs also if they are just IMG tags. I'll fix this also.

4x4 Mecca 06-26-2007 06:01 AM
Also, the pictures overlap eachother in thumbnail mode when you mouseover them. This may be because I made my thumbs larger. Is there a CSS variable to make the thumbnail like 50% of the screen res, but let the height be free(not confined?)


All times are GMT. The time now is 06:57 AM.
Page 1 of 8 1 23 Last »
Show 40 post(s) from this thread on one page

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2025, vBulletin Solutions Inc.

X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.01150 seconds
  • Memory Usage 1,740KB
  • Queries Executed 10 (?)
More Information
Template Usage:
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (1)bbcode_code_printable
  • (2)bbcode_quote_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (2)pagenav_pagelink
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (10)printthreadbit
  • (1)spacer_close
  • (1)spacer_open 
Phrase Groups Available:
  • global
  • postbit
  • showthread
Included Files:
  • ./printthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/class_bbcode_alt.php
  • ./includes/class_bbcode.php
  • ./includes/functions_bigthree.php 
Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • printthread_start
  • pagenav_page
  • pagenav_complete
  • bbcode_fetch_tags
  • bbcode_create
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • printthread_post
  • printthread_complete