script kai frontPage

Κώδικας, πληροφορίες, ερωτήσεις και απαντήσεις σχετικές με την JavaScript.

Συντονιστές: WebDev Moderators, Super-Moderators

Απάντηση
gorgee
Δημοσιεύσεις: 18
Εγγραφή: 19 Οκτ 2003 16:13

script kai frontPage

Δημοσίευση από gorgee » 22 Ιούλ 2004 19:48

Kalispera !!! pos ginete me ayton ton kodika kai meso tou front page na kanei fadein tis foto ekei pou thelo kai oxi sto telos tis selidas pou to vanei ato apo mono tou???

Κώδικας: Επιλογή όλων

<script language="JavaScript1.2">

//Fade-in image slideshow- By Dynamic Drive
//For full source code and more DHTML scripts, visit http&#58;//www.dynamicdrive.com
//This credit MUST stay intact for use

var slideshow_width='140px' //SET IMAGE WIDTH
var slideshow_height='225px' //SET IMAGE HEIGHT
var pause=3000 //SET PAUSE BETWEEN SLIDE &#40;3000=3 seconds&#41;

var fadeimages=new Array&#40;&#41;
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages&#91;0&#93;="photo1.jpg"
fadeimages&#91;1&#93;="photo2.jpg"
fadeimages&#91;2&#93;="photo3.jpg"

////NO need to edit beyond here/////////////

var preloadedimages=new Array&#40;&#41;
for &#40;p=0;p<fadeimages.length;p++&#41;&#123;
preloadedimages&#91;p&#93;=new Image&#40;&#41;
preloadedimages&#91;p&#93;.src=fadeimages&#91;p&#93;
&#125;

var ie4=document.all
var dom=document.getElementById

if &#40;ie4||dom&#41;
document.write&#40;'<div style="position&#58;relative;width&#58;'+slideshow_width+';height&#58;'+slideshow_height+';overflow&#58;hidden"><div  id="canvas0" style="position&#58;absolute;width&#58;'+slideshow_width+';height&#58;'+slideshow_height+';top&#58;0;left&#58;0;filter&#58;alpha&#40;opacity=10&#41;;-moz-opacity&#58;10"></div><div id="canvas1" style="position&#58;absolute;width&#58;'+slideshow_width+';height&#58;'+slideshow_height+';top&#58;0;left&#58;0;filter&#58;alpha&#40;opacity=10&#41;;-moz-opacity&#58;10"></div></div>'&#41;
else
document.write&#40;'<img name="defaultslide" src="'+fadeimages&#91;0&#93;+'">'&#41;

var curpos=10
var degree=10
var curcanvas="canvas0"
var curimageindex=0
var nextimageindex=1


function fadepic&#40;&#41;&#123;
if &#40;curpos<100&#41;&#123;
curpos+=10
if &#40;tempobj.filters&#41;
tempobj.filters.alpha.opacity=curpos
else if &#40;tempobj.style.MozOpacity&#41;
tempobj.style.MozOpacity=curpos/100
&#125;
else&#123;
clearInterval&#40;dropslide&#41;
nextcanvas=&#40;curcanvas=="canvas0"&#41;? "canvas0" &#58; "canvas1"
tempobj=ie4? eval&#40;"document.all."+nextcanvas&#41; &#58; document.getElementById&#40;nextcanvas&#41;
tempobj.innerHTML='<img src="'+fadeimages&#91;nextimageindex&#93;+'">'
nextimageindex=&#40;nextimageindex<fadeimages.length-1&#41;? nextimageindex+1 &#58; 0
setTimeout&#40;"rotateimage&#40;&#41;",pause&#41;
&#125;
&#125;

function rotateimage&#40;&#41;&#123;
if &#40;ie4||dom&#41;&#123;
resetit&#40;curcanvas&#41;
var crossobj=tempobj=ie4? eval&#40;"document.all."+curcanvas&#41; &#58; document.getElementById&#40;curcanvas&#41;
crossobj.style.zIndex++
var temp='setInterval&#40;"fadepic&#40;&#41;",50&#41;'
dropslide=eval&#40;temp&#41;
curcanvas=&#40;curcanvas=="canvas0"&#41;? "canvas1" &#58; "canvas0"
&#125;
else
document.images.defaultslide.src=fadeimages&#91;curimageindex&#93;
curimageindex=&#40;curimageindex<fadeimages.length-1&#41;? curimageindex+1 &#58; 0
&#125;

function resetit&#40;what&#41;&#123;
curpos=10
var crossobj=ie4? eval&#40;"document.all."+what&#41; &#58; document.getElementById&#40;what&#41;
if &#40;crossobj.filters&#41;
crossobj.filters.alpha.opacity=curpos
else if &#40;crossobj.style.MozOpacity&#41;
crossobj.style.MozOpacity=curpos/100
&#125;

function startit&#40;&#41;&#123;
var crossobj=ie4? eval&#40;"document.all."+curcanvas&#41; &#58; document.getElementById&#40;curcanvas&#41;
crossobj.innerHTML='<img src="'+fadeimages&#91;curimageindex&#93;+'">'
rotateimage&#40;&#41;
&#125;

if &#40;ie4||dom&#41;
window.onload=startit
else
setInterval&#40;"rotateimage&#40;&#41;",pause&#41;

</script>

<p align="center"><font face="Arial" size="-2"><br>
<a href="</a></font></p>

efxaristo

Άβαταρ μέλους
EneMe
Super Moderator
Δημοσιεύσεις: 13307
Εγγραφή: 09 Ιούλ 2002 13:29
Τοποθεσία: Στο κέντρο της Ελλάδας!
Επικοινωνία:

script kai frontPage

Δημοσίευση από EneMe » 22 Ιούλ 2004 21:57

Λοιπόν...

Δοκίμασα το script αυτό και μου λειτούργησε κανονικά!

Κατ' αρχήν το

Κώδικας: Επιλογή όλων

<p align="center"><font face="Arial" size="-2"><br>
<a href="</a></font></p>
που υπάρχει στο τέλος του κώδικα που έδωσες δεν είναι μέρος του script, οπότε βγάλ'το! (άσε που έχει και λάθος)

Το script λοιπόν εμφανίζεται όπου το βάλεις!

Εγώ έκανα την εξής δοκιμή:

Κώδικας: Επιλογή όλων

<html>
lalalalalalalala

<script language="JavaScript1.2">
κώδικας-κώδικας-κώδικας
</script>

lalalalalalal
</html>
Και έβγαλε το επιθυμητό αποτέλεσμα!

Ψάξ' το λίγο καλύτερα, κάποιο λάθος έχεις κάνει στην τοποθέτηση του script! :wink:

gorgee
Δημοσιεύσεις: 18
Εγγραφή: 19 Οκτ 2003 16:13

script kai frontPage

Δημοσίευση από gorgee » 22 Ιούλ 2004 23:50

ayto emena to emfanizi kato aristera eno ego to thelo pano stin mesi tis selidas opou kai na to balo sto kentro den paei

Άβαταρ μέλους
EneMe
Super Moderator
Δημοσιεύσεις: 13307
Εγγραφή: 09 Ιούλ 2002 13:29
Τοποθεσία: Στο κέντρο της Ελλάδας!
Επικοινωνία:

script kai frontPage

Δημοσίευση από EneMe » 23 Ιούλ 2004 12:46

Toποθέτησέ το μεσα σε έναν κεντραρισμένο πίνακα! ;)

Άβαταρ μέλους
jps
Δημοσιεύσεις: 53
Εγγραφή: 28 Σεπ 2003 18:16
Τοποθεσία: Orchomenos
Επικοινωνία:

script kai frontPage

Δημοσίευση από jps » 25 Ιούλ 2004 05:12

Πολύ καλή και λειτουργική η ιδέα του EneMe για τον πίνακα.
Το δοκίμασες gorgee;
Αν θέλεις να εμφανίζονται οι εικόνες στο κέντρο της σελίδας και να έχεις κείμενο ή οτιδήποτε άλλο δεξιά ή αριστερά φτιάξε πίνακα με 3 κελιά και βάλε το java script στο κεντρικό κελί. Στο κελί αυτό δώσε πλάτος όση θα είναι η ενεργός περιοχή του script (θα εξηγήσω παρακάτω).

Τώρα λίγη ανάλυση για τη λειτουργία του java script που ίσως σε βοηθήσει.

1) _ _ _ _

var slideshow_width='140px' //SET IMAGE WIDTH
var slideshow_height='225px' //SET IMAGE HEIGHT


Οι τιμές αυτές δεν είναι το μέγεθος των εικόνων που θα ορίσεις αλλά η ενεργός και ορατή περιοχή του script. Δηλαδή εσύ μπορεί να βάλεις μια εικόνα με διαστάσεις 500 πλάτος και 600 ύψος. Αυτό που θα εμφανίζεται όμως θα είναι ένα κομμάτι της εικόνας 140Χ225 αρχίζοντας η μέτρηση από αριστερά (για το πλάτος) και από πάνω (για το ύψος).

2) _ _ _ _

<div style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';overflow:hidden"><div id="canvas0" style="position:relative;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10"></div><div id="canvas1" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10"></div></div>

Εδώ ορίζεται από που αρχίζουν να εμφανίζονται οι εικόνες.
Η προεπιλογή είναι 0 από πάνω [top:0;] και 0 από αριστερά [left:0;] σε σχέση με τη σελίδα. Δηλαδή αν αλλάξεις τις τιμές σε top:10; και left:100; θα εμφανίζεται ένα τμήμα της εικόνας που θα απέχει 10px και 100px από πάνω και αριστερά της σελίδας. Εδώ τώρα χρειάζεται ένας συνδυασμός τιμών για να εμφανίζονται ολόκληρες οι εικόνες και όχι ένα τμήμα τους.

Για να εμφανίζεται ολόκληρη η εικόνα, στο αρχικό τμήμα του κώδικα πρέπει να γράψεις σαν πλάτος το άθροισμα: τιμή του left + πλάτος της εικόνας και σαν ύψος: τιμή του top + ύψος της εικόνας.

Όπως θα παρατηρείς στον παραπάνω κώδικα υπάρχουν 2 θέσεις με τιμές top:0; και left:0;. Αφορούν τις διαδοχικές εικόνες και πρέπει να έχουν τις ίδιες τιμές. Αν γράψεις διαφορετικές τιμές θα βλέπεις 2 εικόνες (δοκίμασέ το για να δεις πως ακριβώς λειτουργεί).

3) _ _ _ _
Η ενεργός περιοχή του script θα εμφανιστεί στη θέση που θα έχεις καθορίσει με τον παραπάνω τρόπο ανεξάρτητα και πάνω από τα υπόλοιπα περιεχόμενα της σελίδας σου. Έτσι με λίγες δοκιμές μπορείς να έχεις κείμενο, άλλες εικόνες ή οτιδήποτε άλλο δεξιά ή και αριστερά των εικόνων που θα εμφανίζει το java script. Για να συμβεί αυτό όμως όλος ο κώδικας πρέπει να γραφτεί αμέσως μετά το <body> και πριν από οτιδήποτε άλλο.
Αν γράψεις κάτι πριν τον κώδικα αυτό θα εμφανίζεται πριν το script.

Το σίγουρο είναι οτι σε ζάλισα αλλά αξίζει τον κόπο αν αυτό σε βοηθήσει στον καλύτερο χειρισμό του script.
Το ωραίο είναι παντού...
Μόνο που τα μάτια της ψυχής μας δεν είναι πάντα ανοιχτά.


Άβαταρ μέλους
tolis_montana
Honorary Member
Δημοσιεύσεις: 913
Εγγραφή: 13 Απρ 2004 01:15
Τοποθεσία: στο κοσμο μου...
Επικοινωνία:

script kai frontPage

Δημοσίευση από tolis_montana » 25 Ιούλ 2004 23:06

enemie kalh skepsi re alla o filos mas edo katalabeno ti 8elei na pei giati kai go ta perasa me to front page dhl sigoyra paei na balei to pinaka alla an exei p,x ena banner akribos apo dipla metakinite to baner .....

Άβαταρ μέλους
tolis_montana
Honorary Member
Δημοσιεύσεις: 913
Εγγραφή: 13 Απρ 2004 01:15
Τοποθεσία: στο κοσμο μου...
Επικοινωνία:

script kai frontPage

Δημοσίευση από tolis_montana » 25 Ιούλ 2004 23:11

mallon la8os tora katalaba ta kellia 8a prepei na ta kanis apo tin arxi dhladh kalo 8a eine na sxediaseis kapoy ti selida kai na ti xoriseiw me kelia xmm mprabo enemie orea skepsi re file kai eixa frikari me to fp

Άβαταρ μέλους
EneMe
Super Moderator
Δημοσιεύσεις: 13307
Εγγραφή: 09 Ιούλ 2002 13:29
Τοποθεσία: Στο κέντρο της Ελλάδας!
Επικοινωνία:

script kai frontPage

Δημοσίευση από EneMe » 25 Ιούλ 2004 23:50

Nαι, όταν δουλεύεις έτσι απλά, καλό είναι να χωρίζεις όλη την σελίδα σου σε πίνακες! ;)

Άβαταρ μέλους
tolis_montana
Honorary Member
Δημοσιεύσεις: 913
Εγγραφή: 13 Απρ 2004 01:15
Τοποθεσία: στο κοσμο μου...
Επικοινωνία:

script kai frontPage

Δημοσίευση από tolis_montana » 26 Ιούλ 2004 00:03

em kati allo tora poy se brika yparxei kapoios kwdikos h kapoio programa poy na bazei ligo se ttaxh to kwdika (sto fp aspoyme ?

Άβαταρ μέλους
EneMe
Super Moderator
Δημοσιεύσεις: 13307
Εγγραφή: 09 Ιούλ 2002 13:29
Τοποθεσία: Στο κέντρο της Ελλάδας!
Επικοινωνία:

script kai frontPage

Δημοσίευση από EneMe » 26 Ιούλ 2004 00:14

Έχω ακούσει για html compression (πχ http://www.freesoft.fsnet.co.uk/html01.htm ) αλλά δεν έχω ούτε πρόκειται να δοκιμάσω! Δεν το εμπιστεύομαι!

Απάντηση

Επιστροφή στο “JavaScript και Frameworks”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 1 επισκέπτης