[b] It works in all the major browsers - Mozilla Firefox 1.5+, Opera 9+, Safari and IE6+ This code only accepts images over 64x64 in dimension, so your buttons and linker images should remain fine [/b] [b]Preview:[/b] disabled I'm using a new trick on my tracker. Refer to screenshots for preview [b]screenshot 1:[/b] [align=center]-from this- [img]http://h1.ripway.com/shakiro/images/instant.JPG[/img] -to this-[/align] [b]screenshot 2:[/b] [img]http://h1.ripway.com/shakiro/images/instant2.jpg[/img] [b]Step 1:[/b] Download this zip file containing the [url=http://www.netzgesta.de/instant/instant.zip]instant.js[/url] [quote][b]contents:[/b] * instant.js * index.html example of it's usage[/quote] [b]Now:[/b] extract instant.js [b]And:[/b] upload instant.js to file host [b]Step 2:[/b] Inject the [b][color=green]instant.js[/color][/b] url via your js file. If you don't know how to do this, try inserting the following code in your js: <">[b]Step 3:[/b] Set any images you want to be turned into photo images by adding a [b]class="instant"[/b] attribute. You can also use [b]class="instant itiltright"[/b] to make the all of the images tilt to one direction. If you do not know how to do this, try injecting the following code to select all images in your profile: <">To apply it only on images that do not already have classnames, you can do this: <">You can also try to add the classNames this way instead of using a setTimeout: [quote]if ( ! attachOnLoadHandler(function () {snapPhotos();})) window.onload = function () {snapPhotos();}; function snapPhotos(){ var elements = document.getElementsByTagName('img'); var i = 0; while (i < elements.length) { elements[i].className="instant"; i++; } }[/quote] [b][color=green]Optional![/color] Applying it in your tracker.php[/b] [b]The javascript:[/b] Insert this into the head of tracker php(outside of the [b]<?php codes?>[/b]), and don't forget to edit the path to your js: <">[b]And:[/b] insert this before the closing </body> tag(outside of the [b]<?php codes?>[/b]): <">[b]The CSS:[/b] Make sure that your imgblock and your imgblock images have the same width & height, and also that both the width and height are greater than [b]64px[/b]: [quote]/*img*/ .imgblock { height:85px; width:77px; } .imgblock img { height: 85px; width:77px; border: 0px; }[/quote] [b]That's it! You're done [/b] [b]* for additional ways to use the instant.js, see the index.html included with the zip file[/b] [b]Preview:[/b] disabled I'm using a new trick on my tracker. Refer to screenshots for preview [b]credits: * instant.js 1.4 (16-Dec-2007) * (c) by Christian Effenberger * All Rights Reserved * Source: glossy.netzgesta.de * me [img]http://h1.ripway.com/shakiro/69.gif[/img][/b]

Last edited by shakiro214 (2008-03-11 12:21:49)