Pages: 12
Based on Slimbox and Mootools javascript library, [b]Mediabox[/b] can handle your images, videos, animations, social video sites, inline elements, and external pages with ease. :arrow: first downloa
You are viewing a post by simpleMe. View all 39 posts in Based on Slimbox and Mootools javascript library, [b]Mediabox[/b] can handle your images, videos, animations, social video sites, inline elements, and external pages with ease. :arrow: first downloa.
2008-10-31 04:24:08
- simpleMe
- » FTalkManiac
949
0
1969-12-31
Based on Slimbox and Mootools javascript library, [b]Mediabox[/b] can handle your images, videos, animations, social video sites, inline elements, and external pages with ease. :arrow: first downloa
Based on Slimbox and Mootools javascript library, [b]Mediabox[/b] can handle your images, videos, animations, social video sites, inline elements, and external pages with ease.
first download this files 
[url=http://h1.ripway.com/retch/mediabox/slimbox.css]slimbox.css[/url]
[url=http://h1.ripway.com/retch/mediabox/slimbox.js]slimbox.js[/url]
[url=http://h1.ripway.com/retch/mediabox/mediabox.js]mediabox.js[/url]
[url=http://h1.ripway.com/retch/mediabox/QuickTime.js]QuickTime.js[/url]
[url=http://h1.ripway.com/retch/mediabox/swfobject.js]swfobject.js[/url]
i just in include QuickTime.js & swfobject.js, if you don't want to used swf & Quicktime player don't used those files
Installation
[quote]Asset.css('[b]slimbox.css link here[/b]');
Asset.javascript('[b]QuickTime.js link here[/b]');
Asset.javascript('[b]swfobject.js link here[/b]');
Asset.javascript('[b]mediabox.js link here[/b]');
window.addEvent('domready', function() {
document.getElements('img').each(function(e){e.getParent().rel='Lightbox';e.getParent().href=e.src});
Asset.javascript('[b]slimbox.js link here[/b]');
});
window.addEvent('domready', function() {onPageLoad()});[/quote]
just edit the bold parts, and paste it on your js file
it also triggered your images with that script
How to apply?
heres the plain html code
[quote]<a href="[b]link here[/b]"rel="mediabox[[color=#FF0000]1100[/color] [color=blue]550[/color]]" title="[b]Title here[/b]">[b]Link title[/b]</a>[/quote]
[color=#FF0000]red[/color] - width
[color=blue]blue[/color] - height
just modify on the code by using rel="[b]mediabox[/b]" attributes 
for image, instead of using [b]mediabox[/b] rel attributes used [b]lightbox[/b]
[quote]<a href=""[b]image link here[/b]" rel="[b]lightbox[/b]" title="[b]Title here[/b]"><img src="[b]thumbnail link here[/b]"/></a>[/quote]
if you don't like to make a thumbnail, used this instead
[quote]<a href=""[b]link here[/b]" rel="lightbox" title="[b]Title here[/b]"><img src="[b]image link here[/b]" width="[b]75[/b]px" height="[b]75[/b]px"/></a>[/quote]
just edit the bold parts with your own
for your gallery, instead of using [b]mediabox[/b] or [b]lightbox[/b] rel attributes used [b]lightboxatomium[/b]
gallery example
[quote]<a href="[b]image link here[/b]" rel="[b]lightboxatomium[/b]" title="[b]title here[/b]"><img src="[b]thumbnail link here[/b]"/></a><a href="[b]image link here[/b]" rel="[b]lightboxatomium[/b]" title="[b]title here[/b]"><img src="[b]image link here[/b]"/></a><a href="[b]image link here[/b]" rel="[b]lightboxatomium[/b]" title="[b]title here[/b]"><img src="[b]thumbnail link here[/b]"/></a><a href="[b]image link here[/b]" rel="[b]lightboxatomium[/b]" title="[b]title here[/b]"><img src="[b]thumbnail link here[/b]"/></a><a href="[b]image link here[/b]" rel="[b]lightboxatomium[/b]" title="[b]title here[/b]"><img src="[b]thumbnail link here[/b]"/></a><a href="[b]image link here[/b]" rel="[b]lightboxatomium[/b]" title="[b]title here[/b]"><img src="[b]thumbnail link here[/b]"/></a>[/quote]
if you don't like to make a thumbnail
just add [quote]width="[b]75[/b]px" height="[b]75[/b]px"[/quote]
just modify on the width & height you like
on open, direct to your [b]About Me[/b] or [b]Who i want to meet[/b] section
[quote]<body onload="Mediabox.open('[b]Link here[/b]', '[b]Title here[/b]', 'mediabox[[color=#FF0000]1100[/color] [color=blue]500[/color]]')">[/quote]
right click, direct to your [b]About Me[/b] or [b]Who i want to meet[/b] section
[quote]<script type="text/javascript">
function popup(){
Mediabox.open('[b]Link here[/b]', '[b]Title here[/b]', 'mediabox[[color=#FF0000]1100[/color] [color=blue]500[/color]]');
}
document.oncontextmenu=popup
</script>[/quote]
[color=#FF0000]red[/color] - width
[color=blue]blue[/color] - height
thats it!
just modify on the code by using there rel attributes, [b]mediabox[/b] for link, [b]lighbox[/b] for image, [b]lightboxatomium[/b] for gallery
don't forget to change the [b]"[/b] into [b]\"[/b] on applying it on your js file
[url=http://h1.ripway.com/retch/mediabox/mediaboxxxx.html]examples[/url]
[url=http://profiles.friendster.com/83667950]preview[/url]
credits [b]iaian7.com[/b] (for mediabox)
first download this files
[url=http://h1.ripway.com/retch/mediabox/slimbox.css]slimbox.css[/url]
[url=http://h1.ripway.com/retch/mediabox/slimbox.js]slimbox.js[/url]
[url=http://h1.ripway.com/retch/mediabox/mediabox.js]mediabox.js[/url]
[url=http://h1.ripway.com/retch/mediabox/QuickTime.js]QuickTime.js[/url]
[url=http://h1.ripway.com/retch/mediabox/swfobject.js]swfobject.js[/url]
i just in include QuickTime.js & swfobject.js, if you don't want to used swf & Quicktime player don't used those files
Installation
[quote]Asset.css('[b]slimbox.css link here[/b]');
Asset.javascript('[b]QuickTime.js link here[/b]');
Asset.javascript('[b]swfobject.js link here[/b]');
Asset.javascript('[b]mediabox.js link here[/b]');
window.addEvent('domready', function() {
document.getElements('img').each(function(e){e.getParent().rel='Lightbox';e.getParent().href=e.src});
Asset.javascript('[b]slimbox.js link here[/b]');
});
window.addEvent('domready', function() {onPageLoad()});[/quote]
just edit the bold parts, and paste it on your js file
it also triggered your images with that script
How to apply?
heres the plain html code
[quote]<a href="[b]link here[/b]"rel="mediabox[[color=#FF0000]1100[/color] [color=blue]550[/color]]" title="[b]Title here[/b]">[b]Link title[/b]</a>[/quote]
[color=#FF0000]red[/color] - width
[color=blue]blue[/color] - height
just modify on the code by using rel="[b]mediabox[/b]" attributes
for image, instead of using [b]mediabox[/b] rel attributes used [b]lightbox[/b]
[quote]<a href=""[b]image link here[/b]" rel="[b]lightbox[/b]" title="[b]Title here[/b]"><img src="[b]thumbnail link here[/b]"/></a>[/quote]
if you don't like to make a thumbnail, used this instead
[quote]<a href=""[b]link here[/b]" rel="lightbox" title="[b]Title here[/b]"><img src="[b]image link here[/b]" width="[b]75[/b]px" height="[b]75[/b]px"/></a>[/quote]
just edit the bold parts with your own
for your gallery, instead of using [b]mediabox[/b] or [b]lightbox[/b] rel attributes used [b]lightboxatomium[/b]
gallery example
[quote]<a href="[b]image link here[/b]" rel="[b]lightboxatomium[/b]" title="[b]title here[/b]"><img src="[b]thumbnail link here[/b]"/></a><a href="[b]image link here[/b]" rel="[b]lightboxatomium[/b]" title="[b]title here[/b]"><img src="[b]image link here[/b]"/></a><a href="[b]image link here[/b]" rel="[b]lightboxatomium[/b]" title="[b]title here[/b]"><img src="[b]thumbnail link here[/b]"/></a><a href="[b]image link here[/b]" rel="[b]lightboxatomium[/b]" title="[b]title here[/b]"><img src="[b]thumbnail link here[/b]"/></a><a href="[b]image link here[/b]" rel="[b]lightboxatomium[/b]" title="[b]title here[/b]"><img src="[b]thumbnail link here[/b]"/></a><a href="[b]image link here[/b]" rel="[b]lightboxatomium[/b]" title="[b]title here[/b]"><img src="[b]thumbnail link here[/b]"/></a>[/quote]
if you don't like to make a thumbnail
just add [quote]width="[b]75[/b]px" height="[b]75[/b]px"[/quote]
just modify on the width & height you like
on open, direct to your [b]About Me[/b] or [b]Who i want to meet[/b] section
[quote]<body onload="Mediabox.open('[b]Link here[/b]', '[b]Title here[/b]', 'mediabox[[color=#FF0000]1100[/color] [color=blue]500[/color]]')">[/quote]
right click, direct to your [b]About Me[/b] or [b]Who i want to meet[/b] section
[quote]<script type="text/javascript">
function popup(){
Mediabox.open('[b]Link here[/b]', '[b]Title here[/b]', 'mediabox[[color=#FF0000]1100[/color] [color=blue]500[/color]]');
}
document.oncontextmenu=popup
</script>[/quote]
[color=#FF0000]red[/color] - width
[color=blue]blue[/color] - height
thats it!
just modify on the code by using there rel attributes, [b]mediabox[/b] for link, [b]lighbox[/b] for image, [b]lightboxatomium[/b] for gallery
don't forget to change the [b]"[/b] into [b]\"[/b] on applying it on your js file
[url=http://h1.ripway.com/retch/mediabox/mediaboxxxx.html]examples[/url]
[url=http://profiles.friendster.com/83667950]preview[/url]
credits [b]iaian7.com[/b] (for mediabox)
Last edited by simpleMe (2008-12-06 22:28:45)
 |