mardi 29 mai 2012
dimanche 20 mai 2012
Limiter le nombre des caracteres dans un text box en utilisant javascript et pure html
Je ne suis pas un chevronné en Javascript , j'essaie de fabriquer du code. En bidouillant et en utilisant google comme ami , je suis arrivé à une conclusion qui a sauvé ma journée.
Javascript code :
<script language = "Javascript">
maxL=255;
var bName = navigator.appName;
function taLimit(taObj) {
if (taObj.value.length==maxL) return false;
return true;
}
function taCount(taObj,Cnt) {
objCnt=createObject(Cnt);
objVal=taObj.value;
if (objVal.length>maxL) objVal=objVal.substring(0,maxL);
if (objCnt) {
if(bName == "Netscape"){
objCnt.textContent=maxL-objVal.length;}
else{objCnt.innerText=maxL-objVal.length;}
}
return true;
}
function createObject(objId) {
if (document.getElementById) return document.getElementById(objId);
else if (document.layers) return eval("document." + objId);
else if (document.all) return eval("document.all." + objId);
else return eval("document." + objId);
}
</script>
HTML Code
<font>
<textarea onKeyPress="return taLimit(this)" onKeyUp="return taCount(this,'myCounter')" name="Description" rows=7 wrap="physical" cols=40>
</textarea>
<br><br>
Il vous reste <B><SPAN id=myCounter>255</SPAN></B> caractere pour les commentaires..</font>
Javascript code :
<script language = "Javascript">
maxL=255;
var bName = navigator.appName;
function taLimit(taObj) {
if (taObj.value.length==maxL) return false;
return true;
}
function taCount(taObj,Cnt) {
objCnt=createObject(Cnt);
objVal=taObj.value;
if (objVal.length>maxL) objVal=objVal.substring(0,maxL);
if (objCnt) {
if(bName == "Netscape"){
objCnt.textContent=maxL-objVal.length;}
else{objCnt.innerText=maxL-objVal.length;}
}
return true;
}
function createObject(objId) {
if (document.getElementById) return document.getElementById(objId);
else if (document.layers) return eval("document." + objId);
else if (document.all) return eval("document.all." + objId);
else return eval("document." + objId);
}
</script>
HTML Code
<font>
<textarea onKeyPress="return taLimit(this)" onKeyUp="return taCount(this,'myCounter')" name="Description" rows=7 wrap="physical" cols=40>
</textarea>
<br><br>
Il vous reste <B><SPAN id=myCounter>255</SPAN></B> caractere pour les commentaires..</font>
lundi 14 mai 2012
Menu horizontal déroulant en CSS
Vu que ce menu ne fonctionne qu'avec des navigateurs récents, il
convient bien entendu de mettre un vrai lien sur l'item survolé, afin
que le navigation ne perde rien en cas de non fonctionnement du
déroulement du menu. C'est une règle à appliquer aussi si on met une
surcouche javascript. Simple histoire de bon sens...
http://css.mammouthland.net/menu-horizontal-deroulant-en-css.php
jeudi 10 mai 2012
Limiter le nombre des caracteres ( couper les caracteres ) d'un texte dans un div avec du css
CODE
RESULTAT
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
.cadre
{
<head>
<style type="text/css">
.cadre
{
overflow:hidden;
white-space:nowrap;
text-overflow: ellipsis;
width:500px;
padding:3px;
height:30px;
border:1px solid #000000;
background-color:#C1C1C1;
}
</style>
</head>
<body>
<div class="cadre">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Nam cursus. Morbi ut mi. Nullam enim leo, egestas id, condimentum at,
laoreet mattis, massa. Sed eleifend nonummy diam. Praesent mauris ante,
elementum et, bibendum at, posuere sit amet, nibh. Duis tincidunt lectus
quis dui viverra vestibulum. Suspendisse vulputate aliquam dui. Nulla elementum
</div>
</body>
</html>
white-space:nowrap;
text-overflow: ellipsis;
width:500px;
padding:3px;
height:30px;
border:1px solid #000000;
background-color:#C1C1C1;
}
</style>
</head>
<body>
<div class="cadre">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Nam cursus. Morbi ut mi. Nullam enim leo, egestas id, condimentum at,
laoreet mattis, massa. Sed eleifend nonummy diam. Praesent mauris ante,
elementum et, bibendum at, posuere sit amet, nibh. Duis tincidunt lectus
quis dui viverra vestibulum. Suspendisse vulputate aliquam dui. Nulla elementum
</div>
</body>
</html>
RESULTAT
Inscription à :
Articles (Atom)