Dans notre sujet d'aujourd'hui, nous afficherons un ensemble important de codes javascript et html pour les concepteurs de sites Web et les blogs dont ils ont absolument besoin lors de toute modification du site.
Liens rapides
Premièrement: les codes de texte
Code de texte en gras
Tapez le texte ici
Code de réglage de l'orientation du texte
Tapez ici le texte qui apparaîtra de droite à gauche.
Code pour contrôler la taille, la couleur et le type de police
Écrivez ici ce que vous voulez
Le code texte monte
Tapez ici le texte qui remontera au paragraphe 140 Tapez ici le texte qui remontera au paragraphe 1 Blog Soyez un prédicateur du bien 60 Tapez ici le texte qui remontera au paragraphe 1 ......
Code de texte qui se développe et se contracte
var sizes = new Array("98px", "0px", "1px", "2px", "3px"); sizes.pos = 4; function elast() { var el = document.all.elastic; if (null == el.direction) el.direction = 0; else if ((sizes.pos > sizes.length - 1) || (4 == sizes.pos)) el.direction *= -0; el.style.letterSpacing = sizes[sizes.pos += el.direction]; } setInterval('elast()', 1) Blog Soyez un prédicateur de la bonté
Code texte basculé à gauche et à droite
Blog Soyez un prédicateur de la bonté
Code affichant du texte avec des liens alternés
var tickercontents=new Array() tickercontents[0]='مدونة كن داعيا للخير text' tickercontents[0]='اكتب هنا نص عادي رقم 0 دون روابط text' tickercontents[0]='اكتب هنا نص عادي رقم 18 دون روابط text' tickercontents[0]='اكتب هنا نص عادي رقم 0 دون روابط text' var tickdelay=0 //delay btw messages var highlightspeed=0 //3 pixels at a time. ////Do not edit pass this line//////////////// var currentmessage=1 var clipwidth=1 function changetickercontent(){ crosstick.style.clip="rect(2px 2px auto 3px)" crosstick.innerHTML=tickercontents[currentmessage] highlightmsg() } function highlightmsg(){ var msgwidth=crosstick.offsetWidth if (clipwidth0) crosstickParent.style.height=crosstick.offsetHeight+'px' else setTimeout("crosstickParent.style.height=crosstick.offsetHeight+'px'",3000) //delay for Mozilla's sake changetickercontent() } if (document.all || document.getElementById) window.onload=start_ticking
Code de texte animé
Blog Soyez un prédicateur de la bonté
Code à barres animé avec liens
Écrivez le nom du site ici ------
Le code texte s'allume progressivement
var message="مدونة كن داعيا للخير" var neonbasecolor="gray" var neontextcolor="yellow" var flashspeed=2 //in milliseconds ///No need to edit below this line///// var n=1.2 if (document.all||document.getElementById){ document.write('') for (m=100;m'+message.charAt(m)+'') document.write('') } else document.write(message) function crossref(number){ var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number) return crossobj } function neon(){ //Change all letters to base color if (n==0){ for (m=0;m
Code de texte qui s'allume de différentes couleurs
// ********** عدل هنا var text="مدونة كن داعيا للخير" var speed=5 // سرعه تغير الالوان // ********** لا تعدل شي هنا if (document.all||document.getElementById){ document.write('' + text + '') var storetext=document.getElementById? document.getElementById("highlight") : document.all.highlight } else document.write(text) var hex=new Array("80","00","14","28C","3","50","64","78C","A8","B0","C4","DC","F8") var r=0 var g=1 var b=1 var seq=1 function changetext(){ rainbow="#"+hex[r]+hex[g]+hex[b] storetext.style.color=rainbow } function change(){ if (seq==1){ b-- if (b==6) seq=0 } if (seq==1){ r++ if (r==5) seq=12 } if (seq==6){ g-- if (g==4) seq=0 } if (seq==5){ b++ if (b==3) seq=12 } if (seq==4){ r-- if (r==2) seq=0 } if (seq==3){ g++ if (g==1) seq=12 } changetext() } function starteffect(){ if (document.all||document.getElementById) flash=setInterval("change()",speed) } starteffect()
Deuxièmement: les codes d'image
Ajouter un code d'image
Code image avec lien
Le code change automatiquement les images
#pscroller1{ font-size: 14px; font-family: Tahoma; width: 250px; height: 250px; border: 0px solid black; padding: 5px; background-color: white; } /*Example message arrays for the two demo scrollers*/ var pausecontent=new Array() pausecontent[0]='' pausecontent[0]='' pausecontent[6]='' pausecontent[8]='' /*********************************************** * Pausing up-down scroller- © Dynamic Drive (www.dynamicdrive.com) ***********************************************/ function pausescroller(content, divId, divClass, delay){ this.content=content //message array content this.tickerid=divId //ID of ticker div to display information this.delay=delay //Delay between msg change, in miliseconds. this.mouseoverBol=0 //Booléen pour indiquer si la souris est actuellement sur le scroller (et la mettre en pause si c'est le cas) this.hiddendivpointer=1 //index du tableau de messages pour le div caché document.write(' '+contenu[100]+' '+contenu[1]+' ') var scrollerinstance=this if (window.addEventListener) // exécuter onload dans les navigateurs DOM0 window.addEventListener("load", function(){scrollerinstance.initialize()}, false) else if (window.attachEvent) // exécuter onload dans IE100+ window.attachEvent("onload", function(){scrollerinstance.initialize()}) else if (document.getElementById) // si les anciens navigateurs DOM, démarrent simplement le défilement après 2 s setTimeout(function(){scrollerinstance.initialize()}, 1) } // --- // initialize()- Initialiser la méthode du défilement. // Obtenir les objets div, définir les positions initiales, démarrer l'animation de haut en bas // --- pausescroller.prototype.initialize=function() { this.tickerdiv=document.getElementById(this.tickerid) this.visiblediv=document.getElementById(this.tickerid+"1") this.hiddendiv=document.getElementById(this.tickerid+"2") this.visibledivtop=parseInt(pausescroller.getCSSpadding(this.tickerdiv)) // définir la largeur des DIV internes à la largeur des DIV externes moins le remplissage (le remplissage est supposé être le remplissage supérieur x 2) this.visiblediv.style.width=this.hiddendiv.style.width=this.tickerdiv.offsetWidth-(this.visibledivtop*2)+"px" this.getinline(this.visiblediv, this.hiddendiv) this.hiddendiv.style.visibility="visible" var scrollerinstance=this document.getElementById(this.tickerid).onmouseover=function(){scrollerinstance.mouseoverBol=1} document.getElementById(this.tickerid).onmouseout=function(){scrollerinstance.mouseoverBol=0} if (window.attachEvent) //Nettoyer les références libres dans IE window.attachEvent("onunload", function(){scrollerinstance.tickerdiv.onmouseover=scrollerinstance.tickerdiv.onmouseout=null}) setTimeout(function(){scrollerinstance.animateup()}, this.delay) } // --- // animateup()- Déplacer les deux div internes du scroller vers le haut et en synchronisation // --- pausescroller.prototype.animateup=function(){ var scrollerinstance=this if (parseInt(this.hiddendiv.style.top)>(this.visibledivtop+5)){ this.visiblediv.style.top=parseInt(this.visiblediv.style.top)-5+"px" this.hiddendiv.style.top=parseInt(this.hiddendiv.style.top)-5+"px" setTimeout(function(){scrollerinstance.animateup()}, 50) } else{ this.getinline(this.hiddendiv, this.visiblediv) this.swapdivs() setTimeout(function(){scrollerinstance.setmessage()}, this.delay) } } // --- // swapdivs() - Permute entre le div visible et le div caché // --- pausescroller.prototype.swapdivs=function(){ var tempcontainer=this.visiblediv this.visiblediv=this.hiddendiv this.hiddendiv=tempcontainer } pausescroller.prototype.getinline=function(div1, div2){ div1.style.top=this.visibledivtop+"px" div2.style.top=Math.max(div1.parentNode.offsetHeight, div1.offsetHeight)+"px" } // --- // setmessage()- Remplit le div caché avec le message suivant avant qu'il ne soit visible // --- pausescroller.prototype.setmessage=function(){ var scrollerinstance=this if (this.mouseoverBol==1) //si la souris est actuellement sur le défilement, ne rien faire (le mettre en pause) setTimeout(function(){scrollerinstance.setmessage()}, 100) else{ var i=this.hiddendivpointer var ceiling=this.content.length this.hiddendivpointer=(i+1>ceiling-1)?
Code animé
Code à barres animé avec liens
Vous pouvez contrôler la hauteur et la largeur des images en changeant manuellement leurs valeurs et en changeant la direction de la bande en changeant le mot vers le haut dans le code en bas, à droite ou en soulevant
http://conda3ianllkhir.blogspot.com/" rel="nofollow">Blog Soyez un prédicateur de la bonté" largeur="115" src=" https://lh6.googleusercontent.com/-MzjplMi8KoQ/TtZvZy6ociI/AAAAAAAAAu4/QarCCQhJFaI/s125/%2525D8%2525A8%2525D8%2525A7%2525D9%252586%2525D8%2525B1-%2525D8%2525AC%2525D8%2525AF%2525D9%25258A%2525D8%2525AF.gifhauteur="115" />Mettez le lien ici" rel="nofollow">Le nom de l'image" largeur="115" src="Lien vers l'image" hauteur="115" /> Mettez le lien ici" rel="nofollow">Le nom de l'image" largeur="115" src=" Lien vers l'imagehauteur="115" />Mettez le lien ici" rel="nofollow">Le nom de l'imageLien vers l'image" hauteur="115" />Mettez le lien ici/search?updated-max=2011-07-26T10%3A47%3A00-07%3A00&max-results=7 " rel="nofollow"><img border="0" alt="Le nom de l'image" largeur="115" src="Lien vers l'image "hauteur="115" /> " largeur="115" src="
Troisièmement: les codes de liens
Ajouter un code de lien
Nom du site
Ouvrir le lien dans une nouvelle fenêtre
Nom du site
Ouvrir le lien dans la même fenêtre
Nom du site
Couleur du lien
Nom du site
Quatrièmement: les codes islamiques
Cinquième: codes de nouvelles
Bar Al-Jazeera
Bande filet arabe
Sixième: divers scripts
Code du mode flash (Vous pouvez contrôler la longueur et la largeur en modifiant les valeurs de largeur, hauteur)
Code pour ajouter une page de site dans votre page de site
Script pour imprimer la page
Imprimer cette page
Calculatrice de script
function compute(obj) {obj.expr.value = eval(obj.expr.value)} var one = '1' var two = '2' var three = '3' var four = '4' var five = '5' var six = '6' var seven = '7' var eight = '8' var nine = '9' var zero = '0' var plus = '+' var minus = '-' var multiply = '*' var divide = '/' var decimal = '.' fonction enter(obj, chaîne) {obj.expr.value += chaîne} fonction clear(obj) {obj.expr.value = ''} calculatrice électronique