Xtreme Resize (lightbox2 bbcode)

[EidolonAH]

This will enable you to use LightBox2 as a BBCode in your posts.

Please note this is only possible due to the fantastic work of HuddleTogether,
so boogie on over to their site and
Download lightbox2 (http://www.huddletogether.com/projects/lightbox2/#download)


upload files from lightbox2 as follows:
css/*.* - root/forum/css/*.*
js/*.* - root/forum/clientscript/*.*
images/*.* - root/forum/images/*.*


Upload the attached image to here:
root/forum/images/ximgrs.png


Create new Custom BBCode

Title:
Xtreme Resize

BB Code Tag Name:
ximgrs

Replacement:
<p><script type="text/javascript" src="clientscript/prototype.js"></script>
<script type="text/javascript" src="clientscript/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="clientscript/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<font color="#000000"><strong>Click Thumbnail to view Full Screenshot Demo</strong></font><br /><br />
<a href="{param}" rel="lightbox" title="{param}"><img src="{param}" width="300" /></a></p>


Example:
url to image

Description:
Lightbox2 bbcode for images

Button Image (Optional) :
images/ximgrs.png

View Demo (http://www.eidolonmh.com/xtreme/showthread.php/41-DTMISOTF-Island)

[Dr.osamA]

thnxxx man !!!

i am weting for this mod

brb for install
________
Girlfriend deepthroat (http://www.++++tube.com/video/7341/nice-slow-deepthroat-from-girlfriend)

[Cableguy69]

Pitty it can't be integrated into the standard BB [IMG] code.

[WNYorker]

can't get this to work.

[EidolonAH]

Pitty it can't be integrated into the standard BB [IMG] code.

It's a simple bbcode not a mod'.

can't get this to work.

How did you use the bbcode?

Example:

url to image

[cloferba]

how can use this lighbox on all pictures posted on my forum??

(not as bbcode)

[EidolonAH]

how can use this lighbox on all pictures posted on my forum??

(not as bbcode)

That would require a fairly extensive mod' to be written, this is just a BBCode, nothing more.

[cloferba]

thanks!, i asked cause i saw a few forums using this lightbox in all its images

[WNYorker]

i did get it to work, however not on the CMS

[EidolonAH]

i did get it to work, however not on the CMS

Are you having problems with your CMS?

This bbcode is working fine on my own CMS:
http://www.eidolonmh.com/xtreme/content.php/115-Zombie-Safe-House-Discovered-in-London

[xman_79]

Thanks,

But I think it would be better if you call the files .Js once in showthread and then do the rest of the code as BBCode

so

in showthread template add

<script type="text/javascript" src="clientscript/prototype.js"></script>
<script type="text/javascript" src="clientscript/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="clientscript/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />


And the Replacement:


<p>
<font color="#000000">
<strong>Click Thumbnail to view Full Screenshot Demo</strong>
</font>
<br />
<br />
<a href="{param}" rel="lightbox" title="{param}"><img src="{param}" width="300" /></a></p>

[cloferba]

That would require a fairly extensive mod' to be written, this is just a BBCode, nothing more.

take the job plz :D

[pedrossi]

Thanks for this, works great!

[twista46]

Work not with 2 Images

[warlord0]

I refreshed this with Lightbox 2.51 and now with JQuery 1.7.2 with VB4.1.12pl1

Create the same BBCode but change the "Replacement" to the following (Notice I also didn't want a text part adding - uncomment it if you do.
<p><script type="text/javascript" src="/forum/clientscript/jquery/jquery-1.7.2.min.js?load=effects,builder"></script>
<script type="text/javascript" src="/forum/clientscript/lightbox.js"></script>
<link rel="stylesheet" href="/forum/css/lightbox.css" type="text/css" media="screen" />
<!--<strong>Click Thumbnail to view Full Image</strong><br />-->
<a href="{param}" rel="lightbox[thispost]" title=""><img title="Click to Zoom In" alt="Click to Zoom In" src="{param}" width="300" /></a></p>

This also shows a tooltip of "Click to Zoom" when a user mouses over and create all images on that page as a group so you can use the left and right arrow navigations from the lightbox.

Basically repeat the steps in the original post, but you'll not find prototype.js in there any more as they've changed to JQuery.

So you'll need to go download JQuery 1.7.2 and put that into the clientscript/jquery folder

NOTICE: This current code also assumes /forum/ as the path to your forum. Just change that if required.

Hope you find it useful.