Σήμερα θα δούμε πως μπορούμε να κάνουμε απόκρυψη και εμφάνιση ενός HTML στοιχείου πολύ απλά χρησιμοποιώντας JavaScript .
Ένα πολύ χρήσιμο trick , ειδικά για αυτούς που χρησιμοποιούν πολλά HTML/JavaScript gadgets στην πλαϊνή τους μπάρα .
Με αυτό το Script μπορούμε να αποκρύψουμε τα gadgets μας ,εξοικονομώντας έτσι χώρο και τα gadgets μας θα εμφανιστούν μόνο όταν κάνουμε κλικ στον τίτλο του gadgets μας .
Δείτε το σε λειτουργία στην πλαϊνή μου μπάρα [ +/- Τα banners των φίλων μου! ] , για να καταλάβετε καλύτερα για τι πρόκειται .
Για να το εγκαταστήσουμε στο blog μας ακολουθούμε τα εξής απλά βήματα :
ΒΗΜΑ 1ο :
1 . Συνδεθείτε στο Blogger λογαριασμό σας και πηγαίνετε Σχεδίαση >> Επεξεργασία HTML και πατήστε στο κουτάκι Επέκταση προτύπων γραφικών στοιχείων
2 . Βρείτε στο πρότυπό σας την ετικέτα ]]></b:skin> και επικολλήστε τις παρακάτω γραμμές του κώδικα ακριβώς από πάνω :
.commenthidden {display:none}
.commentshown {display:inline}
3 . Τώρα βρείτε στο πρότυπό σας την ετικέτα </head> και επικολλήστε τον παρακάτω κώδικα ακριβώς από πάνω :
<!-- togglecomments script -->
<script type='text/Javascript'>
function togglecomments (postid) {
var whichpost = document.getElementById(postid);
if (whichpost.className=="commentshown") { whichpost.className="commenthidden"; } else { whichpost.className="commentshown"; }
}
</script>
ΒΗΜΑ 2ο :
Τώρα , όποιο HTML/JavaScript gadget θέλουμε να αποκρύψουμε απλά θα το εισάγουμε ανάμεσα στους παρακάτω κωδικούς :
<a aiotitle="click to expand" href="javascript:togglecomments(' Ε δω το id του gadget ')"
><h2> +/- ΕΔΩ Ο ΤΙΤΛΟΣ ΤΟΥ GADGET ΜΑΣ </h2></a><br />
<div class="commenthidden" id="Εδω παλι το ιδιο id του gadget ">
Εδώ θα εισάγουμε τον κώδικα για το HTML/JavaScript gadget
</div>
Δείτε ένα παράδειγμα χρήσης για καλύτερη κατανόηση :
Ας πούμε ότι θέλω να αποκρύψω το ShoutMix gadget , τότε ο κώδικας μου θα μοιάζει κάπως έτσι :
<a aiotitle="click to expand" href="javascript:togglecomments(' ShoutMix ')">
<h2>+/- Πείτε τα όλα εδώ ! </h2></a><br />
<div class="commenthidden" id=" ShoutMix ">
<!-- Begin ShoutMix - http://www.shoutmix.com -->
<iframe scrolling="auto" width="300" frameborder="0"
src="XXXXX" height="400" title="χχχ">
<a href="http://shoutmix./?χχχχ">View shoutbox</a> </iframe> <br />
<a href="http://www.shoutmix " title="Get your own free shoutbox chat widget at ShoutMix!">ShoutMix chat widget</a>
<br /> <!-- End ShoutMix -->
</div>
Τώρα αποθηκεύουμε το HTML/JavaScript gadget μας και έχουμε τελειώσει !
Αυτό είναι όλο !!! Εύκολο δεν είναι ?!!
Σημαντικό : Στο παραθυράκι Διαμόρφωση HTML/JavaScript δεν θα εισάγουμε ξανά τίτλο για το HTML/JavaScript gadget μας .
Αφήνουμε το πεδίο για τον τίτλο κενό ! Γιατί έχουμε ορίσει ήδη τίτλο μέσα στον κώδικα που χρησιμοποιήσαμε !
Για όποιες απορίες , αφήστε το σχόλιό σας !
Καλή επιτυχία σε όλους ...
8-) =-O >:o ;)
Πολύ χρήσιμο, Σοφάκι!
Σκάω από την ζέστη. Ειν τυχαίο?
Μουατς
Δεν νομίζω χιχιχιχι :-D Κουράγιο κοριτσάκι μου
Έλα να σε φιλοξενήσω Στην Χαλκιδική να δροσιστείς λίγο , εδώ δεν θα καταλάβεις ούτε ζέστη ούτε τίποτα =-X ;) :-P
Φιλιαααααα
το μεγαλύτερο forum στην Ελλάδα για κινητά με πολα download http://greeceport.xtgem.com