• ARCHIVES 
  • » [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

Pages: 123

[color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

simpleMe
» FTalkManiac
FTalk Level: zero
949
0
1969-12-31

[color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

[color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.ripway.com/theused/simple/left-control.gif[/img] [b]left-control.gif[/b] :arrow: [img]http://h1.ripway.com/theused/simple/right-control.gif[/img] [b]right-control.gif[/b] [b]step 2.[/b] download this files =) :arrow: [url=http://h1.ripway.com/theused/simple/yahoo-dom-event.js]yahoo-dom-event.js[/url] :arrow: [url=http://h1.ripway.com/theused/simple/utility.js]utility.js[/url] :arrow: [url=http://h1.ripway.com/theused/simple/dragdrop-min.js]dragdrop-min.js[/url] :arrow: [url=http://h1.ripway.com/theused/simple/container_core-min.js]container_core-min.js[/url] :arrow: [url=http://h1.ripway.com/theused/simple/carousel.js]carousel.js[/url] :arrow: [url=http://h1.ripway.com/theused/simple/carousel.css]carousel.css[/url] [b]step 3.[/b] Save this as [b].html[/b] =) [quote]<html> <head> <title>Tax Carousel</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="[b]yahoo-dom-event.js link here[/b]"></script> <script type="text/javascript" src="[b]utility.js link here[/b]"></script> <script type="text/javascript" src="[b]dragdrop-min.js link here[/b]"></script> <script type="text/javascript" src="[b]container_core-min.js link here[/b]"></script> <script type="text/javascript" src="carousel.js"></script> <link rel="stylesheet" type="text/css" href="[b]carousel.css link here[/b]"> <link href="css/carousel.css" rel="stylesheet" type="text/css"> <link href="css/yui.css" rel="stylesheet" type="text/css"> <!-- Inlined styles for my overrides to the carousel for this demo. Normally I would put this in a separate CSS file. --> <style type="text/css"> .carousel-component { padding:8px 16px 4px 16px; margin:0px; } .carousel-component .carousel-list li { margin:4px; width:79px; /* img width is 75 px from flickr + a.border-left (1) + a.border-right(1) + img.border-left (1) + img.border-right (1)*/ height:93px; /* image + row of text (87) + border-top (1) + border-bottom(1) + margin-bottom(4) */ /* margin-left: auto;*/ /* for testing IE auto issue */ } .carousel-component .carousel-list li a { display:block; border:1px solid #e2edfa; outline:none; } .carousel-component .carousel-list li a:hover { border: 1px solid #aaaaaa; } .carousel-component .carousel-list li img { border:1px solid #999; display:block; } .carousel-component .carousel-prev { position:absolute; top:40px; z-index:3; cursor:pointer; left:5px; } .carousel-component .carousel-next { position:absolute; top:40px; z-index:3; cursor:pointer; right:5px; } </style> <script type="text/javascript"> /** * Custom button state handler for enabling/disabling button state. * Called when the carousel has determined that the previous button * state should be changed. * Specified to the carousel as the configuration * parameter: prevButtonStateHandler **/ var handlePrevButtonState = function(type, args) { var enabling = args[0]; var leftImage = args[1]; if(enabling) { leftImage.src = "[b]left-control.gif link here[/b]"; } else { leftImage.src = "[b]left-control.gif link here[/b]"; } }; /** * Custom button state handler for enabling/disabling button state. * Called when the carousel has determined that the next button * state should be changed. * Specified to the carousel as the configuration * parameter: nextButtonStateHandler **/ var handleNextButtonState = function(type, args) { var enabling = args[0]; var rightImage = args[1]; if(enabling) { rightImage.src = "[b]right-control.gif link here[/b]"; } else { rightImage.src = "[b]right-control.gif link here[/b]"; } }; /** * You must create the carousel after the page is loaded since it is * dependent on an HTML element (in this case 'mycarousel'.) See the * HTML code below. **/ var carousel; // for ease of debugging; globals generally not a good idea var pageLoad = function() { carousel = new YAHOO.extension.Carousel("mycarousel", { numVisible: 3, animationSpeed: 0.15, scrollInc: 3, navMargin: 20, prevElement: "prev-arrow", nextElement: "next-arrow", size: 19, prevButtonStateHandler: handlePrevButtonState, nextButtonStateHandler: handleNextButtonState } ); }; YAHOO.util.Event.addListener(window, 'load', pageLoad); </script> </head> <body > <div id="doc" class="yui-t7"> <div id="hd"> </div> <div id="bd"> <!-- Carousel Structure --> <div id="mycarousel" class="carousel-component"> <div class="carousel-prev"> <img id="prev-arrow" class="left-button-image" src="[b]left-control.gif link here[/b]" alt="Previous Button"/> </div> <div class="carousel-next"> <img id="next-arrow" class="right-button-image" src="[b]right-control.gif link here[/b]" alt="Next Button"/> </div> <div class="carousel-clip-region"> <ul class="carousel-list"> <li id="mycarousel-item-1"> <a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 1"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-2"><div><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 2"/></a>[b]friend name[/b]</div></li> <li id="mycarousel-item-3"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 3"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-4"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 4"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-5"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 5"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-6"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 6"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-7"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 7"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-8"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 8"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-9"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 9"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-10"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 10"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-11"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 11"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-12"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 12"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-13"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 13"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-14"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 14"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-15"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 15"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-16"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 16"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-17"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 17"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-18"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 18"/></a>[b]friend name[/b]</li> <li id="mycarousel-item-19"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 19"/></a>[b]friend name[/b</li> <li id="mycarousel-item-20"><a href="http://profiles.friendster.com/[b]########[/b]"><img width="75" height="75" src="[b]image link of friend here[/b]" alt="item 20"/></a>[b]friend name[/b]</li> </ul> </div> </div> </div> </div> </body> </html>[/quote] just edit the bold parts =) btw, you can used ([b]jpg,gif,png[/b]) images =) [b]step 4.[/b] paste this on your js extension =) [quote]window.addEvent('domready', function() { var tax = "<iframe style='FILTER: chroma(color=transparent)' allowtransparency='true' frameborder=0 width='350' height='130' scrolling='no' src=[b]Link of .html[/b]></iframe><br><br><a href=\"http://www.friendster.com/friends/[b]Your id[/b]\"><b>View All Friends</b></a><br><br></center>"; document.getElementById('content_2').style.height='100%'; document.getElementById('content_2').style.overflowY='hidden'; document.getElementById('content_2').innerHTML = "<table width='100%'><tr><td align='center'>"+tax+"</td></tr></table>"; });[/quote] just edit the bold parts then your done =) [b]Screenshots[/b] :thumbsdown: [img]http://img262.imageshack.us/img262/9500/97946569au8.png[/img] :arrow: [url=http://h1.ripway.com/theused/simple/01.html]gif sample[/url] :arrow: [url=http://h1.ripway.com/theused/simple/02.html]jpg sample[/url] :arrow: [url=http://profiles.friendster.com/68274085]preview[/url]

Last edited by simpleMe (2008-10-23 04:07:32)

switpotato
» FTalkGeek
FTalk Level: zero
1027
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

hahaha tax u r mastering th the chage content properties lol.. muahhss... :kiss: know wat i wish... someone here will make a one div codes... for all boxes.. so i can emulate overlay effex...

Last edited by switpotato (2008-06-17 02:05:55)

simpleMe
» FTalkManiac
FTalk Level: zero
949
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

[quote=switpotato]hahaha tax u r mastering th the chage content properties lol.. muahhss... :kiss:[/quote] wee... first to comment :D thanks [b]swit[/b] :rose:
Afzulnizam
» SuperFTalker
FTalk Level: zero
8122
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

waa.......nice script.... :thumbsup: thanks for sharing...i like this..
simpleMe
» FTalkManiac
FTalk Level: zero
949
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

[quote=AFZULNIZAM]waa.......nice script.... :thumbsup: thanks for sharing...i like this..[/quote] ur welcome =) happy tweaking =)
Lordheinz
» FTalkElite
FTalk Level: zero
4377
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

:arrow: nice one bro..keep it up...:thumbsup: + reputation for you..:thumbsup:
simpleMe
» FTalkManiac
FTalk Level: zero
949
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

[quote=lordheinz]nice one bro..keep it up...:thumbsup: + reputation for you..:thumbsup:[/quote] thanks for the +repu bro =)
michelle_dedumo
» FTalkAddict
FTalk Level: zero
580
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

wow... cool nice trick.. enx for sharing..
Jonrown12
» FTalker
FTalk Level: zero
151
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

Nice trick. thanks for sharing. :thumbsup:
triciapink29
» FTalkFreak
FTalk Level: zero
1504
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

good job.. nice one.. thanks for sharing.. keep it up.. really awesome repu+ for you but its so hard to apply
cklahrckiey
» FTalkFreak
FTalk Level: zero
1891
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

nice carousel....hehehehe..... :lol: another mind blowing trick.... ([i]burak syo!!![/i])
_YoE_
» FTalker
FTalk Level: zero
232
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

:O wow.. nice trick :thumbsup: thks for share :wow:
simpleMe
» FTalkManiac
FTalk Level: zero
949
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

[quote=triciapink29]but its so hard to apply[/quote] just follow the instructions =) btw, thanks for the [b]+repu[/b] =)
g4LLih09
» n00b
FTalk Level: zero
47
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

wowwwwwwww :thumbsup: :thumbsup: nice trick
Jonrown12
» FTalker
FTalk Level: zero
151
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

By the way + repu to you. cool. i like this trick.. :thumbsup:
simpleMe
» FTalkManiac
FTalk Level: zero
949
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

[quote=Jonrown12]By the way + repu to you. cool. i like this trick.. :thumbsup:[/quote] thanks bro =):thumbsup:
mariiel008
» n00b
FTalk Level: zero
1
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

KUaaa!!!wLA vHA virUS yHAn?!!!?:/ tsaka panu eun?!anu ggwin sa na download?!NEWBIE!me!
anne.24
» FTalkWhiz
FTalk Level: zero
3302
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

Cool...! Thanks 4 sharing! :D
vhon_skyy
» FTalker
FTalk Level: zero
179
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

very nice scripts... youve put some efforts on this.. thanks.. + repu for yah buddy...
simpleMe
» FTalkManiac
FTalk Level: zero
949
0
1969-12-31

Re: [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

[quote=vhon_skyy]+ repu for yah buddy...[/quote] thanks for the [b]+repu[/b] dude =):thumbsup:
  • ARCHIVES 
  • » [color=#FF0000]For Educational Purpose Only[/color] credits :arrow: [b]Carousel Component[/b] just sharing guys =) hope you like it =) [b]step 1.[/b] save this images =) :arrow: [img]http://h1.rip

Pages: 123

Board footer

© 2025 F Talk

Current time is 16:52

[ 10 queries - 0.016 second ]
Privacy Policy