Scriptek – Hitetlen.com

hitetlen.com > Scriptek > Slideshow

Slideshow

2006, július 16.

Tovább a hozzászólásokhoz Szólj hozzá!

Demo:

Kis türelem, a képek töltődnek…

A futó kép megáll, ha a kép felé viszed a kurzort.

HTML Kód:
HEAD részbe:

HTML Kód:
BODY részbe:

<BODY bgColor=#303030 leftMargin=0 topMargin=0><TABLE height="100%" cellSpacing=0 width="100%">  <TBODY>  <TR>    <TD vAlign=center align=middle>      <SCRIPT language=JavaScript1.2>//Az objektum szélessége pixelbenvar sliderwidth="800px"//Az objektum magassága pixelbenvar sliderheight="325px"//Az effekt sebessége (1-10)var slidespeed=5//Az objektum háttérszíneslidebgcolor="#FFFFFF"//A Képek URL-címeit másold bevar leftrightslide=new Array()var finalslide=''leftrightslide[0]='<img src="http://www.hitetlen.com/demo-kepek/0.jpg" border=0 style="filter:alpha(opacity=40)" onfocus="this.blur();" onmouseover="nereidFade(this,100,30,5)" onmouseout="nereidFade(this,40,30,5)">'leftrightslide[1]='<img src="http://www.hitetlen.com/demo-kepek/1.jpg" border=0 style="filter:alpha(opacity=40)" onfocus="this.blur();" onmouseover="nereidFade(this,100,30,5)" onmouseout="nereidFade(this,40,30,5)">'leftrightslide[2]='<img src="http://www.hitetlen.com/demo-kepek/2.jpg" border=0 style="filter:alpha(opacity=40)" onfocus="this.blur();" onmouseover="nereidFade(this,100,30,5)" onmouseout="nereidFade(this,40,30,5)">'leftrightslide[3]='<img src="http://www.hitetlen.com/demo-kepek/3.jpg" border=0 style="filter:alpha(opacity=40)" onfocus="this.blur();" onmouseover="nereidFade(this,100,30,5)" onmouseout="nereidFade(this,40,30,5)">'leftrightslide[4]='<img src="http://www.hitetlen.com/demo-kepek/4.jpg" border=0 style="filter:alpha(opacity=40)" onfocus="this.blur();" onmouseover="nereidFade(this,100,30,5)" onmouseout="nereidFade(this,40,30,5)">'leftrightslide[5]='<img src="http://www.hitetlen.com/demo-kepek/5.jpg" border=0 style="filter:alpha(opacity=40)" onfocus="this.blur();" onmouseover="nereidFade(this,100,30,5)" onmouseout="nereidFade(this,40,30,5)">'leftrightslide[6]='<img src="http://www.hitetlen.com/demo-kepek/6.jpg" border=0 style="filter:alpha(opacity=40)" onfocus="this.blur();" onmouseover="nereidFade(this,100,30,5)" onmouseout="nereidFade(this,40,30,5)">'leftrightslide[7]='<img src="http://www.hitetlen.com/demo-kepek/7.jpg" border=0 style="filter:alpha(opacity=40)" onfocus="this.blur();" onmouseover="nereidFade(this,100,30,5)" onmouseout="nereidFade(this,40,30,5)">'leftrightslide[8]='<img src="http://www.hitetlen.com/demo-kepek/8.jpg" border=0 style="filter:alpha(opacity=40)" onfocus="this.blur();" onmouseover="nereidFade(this,100,30,5)" onmouseout="nereidFade(this,40,30,5)">'leftrightslide[9]='<img src="http://www.hitetlen.com/demo-kepek/9.jpg" border=0 style="filter:alpha(opacity=40)" onfocus="this.blur();" onmouseover="nereidFade(this,100,30,5)" onmouseout="nereidFade(this,40,30,5)">'var copyspeed=slidespeedleftrightslide='<nobr>'+leftrightslide.join(" ")+'</nobr>'var iedom=document.all||document.getElementByIdif (iedom)document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-9000px">'+leftrightslide+'</span>')var actualwidth=''var cross_slide, ns_slidefunction fillup(){if (iedom){cross_slide=document.getElementById? document.getElementById("test2") : document.all.test2cross_slide2=document.getElementById? document.getElementById("test3") : document.all.test3cross_slide.innerHTML=cross_slide2.innerHTML=leftrightslideactualwidth=document.all? cross_slide.offsetWidth : document.getElementById("temp").offsetWidthcross_slide2.style.left=actualwidth+20+"px"}else if (document.layers){ns_slide=document.ns_slidemenu.document.ns_slidemenu2ns_slide2=document.ns_slidemenu.document.ns_slidemenu3ns_slide.document.write(leftrightslide)ns_slide.document.close()actualwidth=ns_slide.document.widthns_slide2.left=actualwidth+20ns_slide2.document.write(leftrightslide)ns_slide2.document.close()}lefttime=setInterval("slideleft()",30)}window.onload=fillupfunction slideleft(){if (iedom){if (parseInt(cross_slide.style.left)>(actualwidth*(-1)+8))cross_slide.style.left=parseInt(cross_slide.style.left)-copyspeed+"px"elsecross_slide.style.left=parseInt(cross_slide2.style.left)+actualwidth+30+"px"if (parseInt(cross_slide2.style.left)>(actualwidth*(-1)+8))cross_slide2.style.left=parseInt(cross_slide2.style.left)-copyspeed+"px"elsecross_slide2.style.left=parseInt(cross_slide.style.left)+actualwidth+30+"px"}else if (document.layers){if (ns_slide.left>(actualwidth*(-1)+8))ns_slide.left-=copyspeedelsens_slide.left=ns_slide2.left+actualwidth+30if (ns_slide2.left>(actualwidth*(-1)+8))ns_slide2.left-=copyspeedelsens_slide2.left=ns_slide.left+actualwidth+30}}if (iedom||document.layers){with (document){document.write('<br />
<table border="0" cellspacing="0" cellpadding="0">
<td>')if (iedom){write('
<div style="position:relative;width:'+sliderwidth+';height:'+sliderheight+';overflow:hidden">')write('
<div style="position:absolute;width:'+sliderwidth+';height:'+sliderheight+';background-color:'+slidebgcolor+'" onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed">')write('
<div id="test2" style="position:absolute;left:0px;top:0px"></div>
<p>')write('
<div id="test3" style="position:absolute;left:-1000px;top:0px"></div>
<p>')write('</p></div>
</div>
<p>')}else if (document.layers){write('<ilayer width='+sliderwidth+' height='+sliderheight+' name="ns_slidemenu" bgColor='+slidebgcolor+'>')write('<layer name="ns_slidemenu2" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')write('<layer name="ns_slidemenu3" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')write('</ilayer>')}document.write('</td>
</table>
<p>')}}</script>      <br /><FONT face=Verdana color=#606060 size=1><I>A futó kép megáll, ha a kép felé viszed a kurzort.</I></FONT>   </TD></TR></TBODY></TABLE></BODY>

Gportálosok a két kódot egymás után másolják be a honlapjukba!

A BODY részben cseréled le a képek URL-címét.
Ha több vagy kevesebb képet szeretnél megjeleníteni,
duplázd vagy töröld a következő sorokat a BODY részben:

leftrightslide[9]='<img src="http://www.hitetlen.com/demo-kepek/9.jpg" border=0 style="filter:alpha(opacity=40)" onfocus="this.blur();" onmouseover="nereidFade(this,100,30,5)" onmouseout="nereidFade(this,40,30,5)">'

Ha duplázod , ne felejsd el a sorszámát növelni! ( leftrightslide[9] )

A BODY részben találsz egy-két állítási lehetőséget.
Igazítsd a honlapod kinézetéhez!

//Az objektum szélessége pixelben
var sliderwidth="800px"
//Az objektum magassága pixelben
var sliderheight="325px"
//Az effekt sebessége (1-10)
var slidespeed=5
//Az objektum háttérszíne
slidebgcolor="#FFFFFF"

Ha a kép fölé húzva az egeret, megjelenik 4 ikon:
a kép mentése, nyomtatása, küldése,
képek mappa megnyitása opciók doboza.
akkor ennek letíltására klikkelj ide.

Kép URL címeKeresel a világhálón egy képet,majd Jobb klikk a képre,és a lenyíló menüből válaszd a Tulajdonságokat.
Az ezután felugró kisablakban találod a kép URL-címét!
Azt másold ki,és cseréld le a kódban található kép URL-címével

Scriptek Kép-effektek

Hozzászólások (16) Visszakövetések (0) Szólj hozzá! Visszakövetés

Kócinán Ákos

október 17th, 2007 20:33-nél | #1

Válasz | Idézet

szerintem jó lett
emi1986

december 1st, 2007 11:14-nél | #2

Válasz | Idézet

Szerbusz!!!! Nagyon király ez a script.DE van 1 kis gond miután beillesztem az oldalra. A vízszintes görgetősáv kb még 5 olalnyit oldalra húzható. Olyan hosszú a kód hogy kilóg. Mit lehet vele csinálni?? Kérlek segítsen valaki…
zsófi

december 23rd, 2007 01:48-nél | #3

Válasz | Idézet

szia! érdekelne, h eme script miért igy látható nálam? http://www.humbertojulien.com kérlek segíts,köszi
zsófi

december 23rd, 2007 01:50-nél | #4

Válasz | Idézet

a képeim magassága pont akkora mint az objektum magassága. Ha állítok rajtuk akkor sem jobb a helyzet. Egy szokott megjelenni jól, a többi mind lecsuszva.
sanyi

február 24th, 2008 16:10-nél | #5

Válasz | Idézet

Slideshow -nal a futo kep nagyon halvany csak ha raklikk akkor normal segits h mit tegyek
hitetlen

február 24th, 2008 17:26-nél | #6

Válasz | Idézet

sanyi. Az szándékosan ilyen. Ha ezt nem akarod, töröld a BODY részből ezt a rész, mint kép url-cím sorából: style=”filter:alpha(opacity=40)
Harvy

június 2nd, 2008 16:53-nél | #7

Válasz | Idézet

Hogyan tudom a fényképek méretét csökkenteni? Az objektum beállításánál méretre szabtam a megadott adatok alapján: //Az objektum magassága pixelben var sliderheight=”325px” azonban a képek mérete nem változott, igy a képek felső fele látszik csak. Mi a megoldás? Előre is köszönöm: Harvy
lukacsx

június 16th, 2008 22:31-nél | #8

Válasz | Idézet

Szia, bocsi kívÜlállóként válaszolok; szerintem a képek méret előzőleg csökkentsd az objektumhoz, egy másik programmal, mondjuk Photoshop-pal, és utána írd be a kódba.
Selene

július 29th, 2008 21:01-nél | #9

Válasz | Idézet

Hogyan rakjam föl mlap-ra (mindenkilapra)? Mien sorrendbe vagy hogyan?
iMMi

július 31st, 2008 21:18-nél | #10

Válasz | Idézet

Sziasztok, érdeklődnék, hogy valaki próbálta e már firefox alatt is működésre bírni? Ha igen hogyan? Mivel az alpha transparencity ebben a formájában csak IE alatt működött… sajnos köszi a választ(okat)
Boci

augusztus 12th, 2008 10:17-nél | #11

Válasz | Idézet

Sziasztok! Az érdekelne, hogy egy oldalra 2 vagy annál több slideshow-t be lehet e illeszteni…. Thx a válaszokat előre is….
Akárki

augusztus 31st, 2008 12:47-nél | #12

Válasz | Idézet

Harvy a képméretet tudod csökkenteni úgy, hogy az eredeti méretéhez nem nyúlsz hozzá. Mégpedig ahol a képek linkjei vannak. Ez most így néz ki: leftrightslide[0]=” A border=0 elé tedd be a következőket: width=”265″ height=”200″ A beírt száma kép méret és magasság pixelben. Ăgy a kép az általad kívánt méretben jelenik meg. Magához a képhez nem kell hozzányúlni. Én éppen ezért beletenném ezt a két tényezőt a scriptbe. És most a kérdésem: Hogyan lehetne megoldani, hogy ne egy meghatározott sorrendben, hanem véletlenszerűen jöjjenek be a képek? Sok képet szeretnék uttatni (több, mint 100-at), és lég uncsi lenne, mindig ugyanaddig jutni. Nagyon gyorsra meg nem akarom, mert úgy nem szép. Szóval hogyan lehetne átalakítani véletlen lejátszásra? Előre is köszönöm.
rubin007

október 7th, 2008 20:23-nél | #13

Válasz | Idézet

Hali! Tudna valaki segíteni? Sajnos nem értek a scriptekhez. Hogy tudom tudom a képet linknek betenni? Ha simán berakom
pszicho

október 19th, 2008 15:40-nél | #14

Válasz | Idézet

Segítsetek, az eskÜvői képeket megkaptam egy DVD-n amit csak PC-n tudunk megnézni mert Slide Show exe van és azt ha inditom a képek oké , de hogy lehet ebből képeket kimenteni hogy DVD kiirás után TV-n nézhető legyen. Előre is köszi ha valaki tud segíteni.
csusza

december 12th, 2008 20:38-nél | #15

Válasz | Idézet

Kedves Szerk.! Mi az a “HEAD” és “BODY” rész? És a mindenkilapjás oldalba hogyan kell betenni? Én egymás után másoltam be a forráskódba, de cag azt az írást adta ki a honlapomon, hogy “Afutó kép megáll, ha felé viszeg a kurzort”. Akkor hát hogyan kell ezt beszúrnom? A segítséget előre is kösz: Csusza
nemren

január 31st, 2009 17:55-nél | #16

Válasz | Idézet

Nagyon jó ez a script, nekem bevált! Annyit viszont kérdeznék, hogy az megolható-e, hogy teljesen folyamatos “menjenek” a képek. Mert miután az utolsó kép is megjelenik egyszer eltűnik, a képek folyamatosan mennek tovább csak látványosan megszakad.