ändra font storlek

2 svar · 350 visningar · startad av pimpelon 1 feb. 2006

pimpelonMedlem sedan nov. 200554 inlägg

1 feb. 2006 19:25#1

Jag försöker få till ett script där man i ett text fält ska kunna skriva en text, och man ser den direkt i en ruta ovanför. så långt är det inget problem. Men jag vill att rutan alltid ska ha samma storlek och inga scroll lister. Hittade ett script som ändrar font storleken så den passar i fältet. Men jag kan inte få till det (Är inte så vass på javascript ).

Någon som har nån ide ?

=======================================================

\<script type="text/javascript"\>
    function resizeLabel(){
    var obj = document.getElementById('textLabel');
    var maxWidth = 400;
    var timeoutCounter=0;
    var theWidth = obj.offsetWidth;
    while(timeoutCounter\<100 && theWidth\<maxWidth){
        obj.style.fontSize = obj.style.fontSize.replace('px','')/1 + 1;
        theWidth = obj.offsetWidth;
        timeoutCounter++;
        
    }
    obj.style.fontSize = obj.style.fontSize.replace('px','')/1 - 1;
        
}

window.onload=resizeLabel;


function laddaTextFram(txt){
	document.getElementById('framtext').innerHTML = txt;
}
\</script\>

</head>
<body>
<div class="myDiv">
<span id="textLabel"><span id="framtext">yg</span></span>
</div>
</div>
<br>
<textarea name="framtext" cols="50" rows="4" onkeyup="resizeLabel();laddaTextFram(this.value);"></textarea>

=======================================================

Peter SMedlem sedan dec. 20025 483 inlägg

1 feb. 2006 23:08#2

Använd gärna kodtaggarna när du postar kod.

Så här?

<script type="text/javascript">
function resizeLabel(txt){
  var obj = document.getElementById('textLabel');
  var maxWidth = 400;
  var oWidth = 0;

  obj.innerHTML = txt;
  oWidth = obj.offsetWidth;

  if(!obj.style.fontSize){ obj.style.fontSize = 1 }

  if (txt){
    if (oWidth < maxWidth)
    while (oWidth < maxWidth){
      obj.style.fontSize = parseInt(obj.style.fontSize) + 1;
      oWidth = obj.offsetWidth;
    }
    else
    while (oWidth > maxWidth){
      obj.style.fontSize = parseInt(obj.style.fontSize) - 1;
      oWidth = obj.offsetWidth;
    }
  }
}

window.onload = function(){
  var ta = document.forms[0].elements["framtext"];
  resizeLabel(ta.value = "yg");
}

</script>
</head>
<body>
 <div class="myDiv">
 <span id="textLabel"></span>
</div>
</div>
<br>
<form>
  <textarea name="framtext" cols="50" rows="4" onkeyup="resizeLabel(this.value);"></textarea>
</form>

pimpelonMedlem sedan nov. 200554 inlägg

2 feb. 2006 08:30#3

Tack... fick modda om lite för att få exact som jag ville... Men annars klockrent!