La version 2 de warioteayuda

Textarea

Textarea Comun

Ejemplo :

Aqui el code Aqui el codAqui el codvvvAqui el codAquiAqui el codvAqui el codAqui el codAqui el codAqui el codAqui el codAqui el cod el cod

Code :

<textarea>
Aqui el code</textarea>

Textarea con tamaño modificable

Ejemplo :

Code :

<textarea rows="5" cols="10">
AQUI VA EL CODIGO QUE QUIERES</textarea>

rows=altura

cols=anchura

Textarea con fondo

Vista previa :

Code :

<style type="text/css">
textarea{
background-image:url(URL DE FONDO);
color:FFFFFF;
}
</style>

Textarea al pasar el mouse se selecciona :

Ejemplo :

AQUI PONES EL TEXTO QUE QUIERAS

<textarea cols="26" name="NOMBRE" rows="4" onfocus="this.select()" onmouseover="this.focus()">
AQUI PONES EL TEXTO QUE QUIERAS
</textarea>

Textarea que no se puede seleccionar :

Ejemplo :

Aquí el código que quieras colocar

Code :

<textarea onfocus="this.blur()">
Aquí el código que quieras colocar
</textarea>

Textarea que soporta cierto numero de letras que borra al escribir (dynamicdrive.com)

Ejemplo :

Aqui tu texto

Poner este codigo :

El textarea :

<textarea maxlength"40" onkeyup="return
ismaxlength(this)Aqui Tu texto</textarea>

El maxlength"40" Es el nº De maximo de palabras

Textarea que soporte cierto numero de letras que no deja escribir(dynamicdrive.com)

Aqui el contenido Extra

Poner este codigo antes :

<style type="text/css"> .progress{ width: 1px; height: 14px; color: white; font-size: 12px; overflow: hidden; background-color: navy; padding-left: 5px; } </style> <script type="text/Javascript"> /*********************************************** * Form Field Progress Bar- By Ron Jonk- http://www.euronet.nl/~jonkr/ * Modified by Dynamic Drive for minor changes * script featured/ available at Dynamic Drive- http://www.dynamicdrive.com * Please keep this notice intact ***********************************************/ function textCounter(field,counter,maxlimit,linecounter) { // text width// var fieldWidth = parseInt(field.offsetWidth); var charcnt = field.value.length; // trim the extra text if (charcnt > maxlimit) { field.value = field.value.substring(0, maxlimit); } else { // progress bar percentage var percentage = parseInt(100 - (( maxlimit - charcnt) * 100)/maxlimit) ; document.getElementById(counter).style.width = parseInt((fieldWidth*percentage)/100)+"px"; document.getElementById(counter).innerHTML="Limit: "+percentage+"%" // color correction on style from CCFFF -> CC0000 setcolor(document.getElementById(counter),percentage,"background-color"); } } function setcolor(obj,percentage,prop){ obj.style[prop] = "rgb(80%,"+(100-percentage)+"%,"+(100-percentage)+"%)"; } </script>

El textarea :

<form>
<textarea rows="5" cols="40" name="maxcharfield" id="maxcharfield"
onKeyDown="textCounter(this,'progressbar1',20)"
onKeyUp="textCounter(this,'progressbar1',20)"
onFocus="textCounter(this,'progressbar1',20)" >Aqui el contenido Extra </textarea><br />
<div id="progressbar1" class="progress"></div>
<script>textCounter(document.getElementById("maxcharfield"),"progressbar1",20)</script>
</form>

El 1, 20 Es el nº Maximo

Textarea Que selecciona todo con boton (dynamicdrive.com)

Select All
Aqui todo tu texto xD !
Este code desde antes :

<style> .highlighttext{ background-color:yellow; font-weight:bold; } </style> <script language="Javascript">  </script>

Para agregar :

<form name="test">
<a class="highlighttext" href="javascript:HighlightAll('test.select1')">Select All</a><br>
<textarea name="select1" rows=10 cols=35 >Aqui todo tu texto xD ! </textarea>
</form>

Textarea a elegir (dynamicdrive.com)

No se puede mostrar la imagen “http://pixelea.com/s/9d9306af59.png” porque contiene errores.

No se puede mostrar la imagen “http://pixelea.com/s/9d9306af59.png” porque contiene errores.

Antes que todo :

/*
Combo-Box Viewer script- Created by and © Dynamicdrive.com
Visit http://www.dynamicdrive.com/ for this script and more
This notice MUST stay intact for legal use
*/

if (document.getElementById){
document.write('<style type="text/css">n')
document.write('.dropcontent{display:none;}n')
document.write('</style>n')
}

function contractall(){
if (document.getElementById){
var inc=0
while (document.getElementById("dropmsg"+inc)){
document.getElementById("dropmsg"+inc).style.display="none"
inc++
}
}
}

function expandone(){
if (document.getElementById){
var selectedItem=document.dropmsgform.dropmsgoption.selectedIndex
contractall()
document.getElementById("dropmsg"+selectedItem).style.display="block"
}
}

if (window.addEventListener)
window.addEventListener("load", expandone, false)
else if (window.attachEvent)
window.attachEvent("onload", expandone)

</script>

Para agregar :

<form name="dropmsgform">
<select name="dropmsgoption" size="1" style="width:300" onChange="expandone()">
<option selected>Elije esta opcion?</option>
<option>Elije esta opcion</option>
<option>Elije esta ! opcion! ?</option>
</select>
<br>
<div id="dropmsg0" class="dropcontent">
Texto en primera opcion !
</div>
<div id="dropmsg1" class="dropcontent">
TEXTO en segunda opcion !
</div>
<div id="dropmsg2" class="dropcontent">
TEXTO EN TERCERA OPCION !
</div>
</form>

En este :

<select name="dropmsgoption" size="1" style="width:300" onChange="expandone()">
<option selected>Elije esta opcion?</option>
<option>Elije esta opcion</option>
<option>Elije esta ! opcion! ?</option>
</select>

<option> y </option> seran las opciones Que estaras elgiendo

El orden que las pongas sera el orden de los textareas

option selected es la que estara leegida por defecto Si no quieres ninguna no las pongas

<div id="dropmsg0" class="dropcontent">
TEXTO EN TERCERA OPCION !
</div>

el dropmsg0" puedes agregar 1 , 2 , 3 o 4 conforme tengas las opciones y vas agregando !

Textarea a elegir que sea automatico o a elegi (dynamicdrive.com) :

JavaScript is a scripting language originally developed by Netscape to add interactivity and power to web documents. It is purely client side, and runs completely on the client's browser and computer.

Java is completely different from JavaScript- it's more powerful, more complex, and unfortunately, a lot harder to master. It belongs in the same league as C, C++, and other more complex languages.

DHTML is the embodiment of a combination of technologies- JavaScript, CSS, and HTML. Through them a new level of interactivity is possible for the end user experience.

Auto: Manual:

Agregar esto encima de la página :
<style type="text/css"> .gallerycontroller{ width: 250px } .gallerycontent{ width: 250px; height: 200px; border: 1px solid black; background-color: #DFDFFF; padding: 3px; display: block; } </style> <script type="text/javascript"> /*********************************************** * Advanced Gallery script- © Dynamic Drive DHTML code library (www.dynamicdrive.com) * This notice must stay intact for legal use * Visit http://www.dynamicdrive.com/ for full source code ***********************************************/ var tickspeed=3000 //ticker speed in miliseconds (2000=2 seconds) var displaymode="auto" //displaymode ("auto" or "manual"). No need to modify as form at the bottom will control it, unless you wish to remove form. if (document.getElementById){ document.write('<style type="text/css">n') document.write('.gallerycontent{display:none;}n') document.write('</style>n') } var selectedDiv=0 var totalDivs=0 function getElementbyClass(classname){ partscollect=new Array() var inc=0 var alltags=document.all? document.all.tags("DIV") : document.getElementsByTagName("*") for (i=0; i<alltags.length; i++){ if (alltags[i].className==classname) partscollect[inc++]=alltags[i] } } function contractall(){ var inc=0 while (partscollect[inc]){ partscollect[inc].style.display="none" inc++ } } function expandone(){ var selectedDivObj=partscollect[selectedDiv] contractall() selectedDivObj.style.display="block" if (document.gallerycontrol) temp.options[selectedDiv].selected=true selectedDiv=(selectedDiv<totalDivs-1)? selectedDiv+1 : 0 if (displaymode=="auto") autocontrolvar=setTimeout("expandone()",tickspeed) } function populatemenu(){ temp=document.gallerycontrol.menu for (m=temp.options.length-1;m>0;m--) temp.options[m]=null for (i=0;i<totalDivs;i++){ var thesubject=partscollect[i].getAttribute("subject") thesubject=(thesubject=="" || thesubject==null)? "HTML Content "+(i+1) : thesubject temp.options[i]=new Option(thesubject,"") } temp.options[0].selected=true } function manualcontrol(menuobj){ if (displaymode=="manual"){ selectedDiv=menuobj expandone() } } function preparemode(themode){ displaymode=themode if (typeof autocontrolvar!="undefined") clearTimeout(autocontrolvar) if (themode=="auto"){ document.gallerycontrol.menu.disabled=true autocontrolvar=setTimeout("expandone()",tickspeed) } else document.gallerycontrol.menu.disabled=false } function startgallery(){ if (document.getElementById("controldiv")) //if it exists document.getElementById("controldiv").style.display="block" getElementbyClass("gallerycontent") totalDivs=partscollect.length if (document.gallerycontrol){ populatemenu() if (document.gallerycontrol.mode){ for (i=0; i<document.gallerycontrol.mode.length; i++){ if (document.gallerycontrol.mode[i].checked) displaymode=document.gallerycontrol.mode[i].value } } } if (displaymode=="auto" && document.gallerycontrol) document.gallerycontrol.menu.disabled=true expandone() } if (window.addEventListener) window.addEventListener("load", startgallery, false) else if (window.attachEvent) window.attachEvent("onload", startgallery) else if (document.getElementById) window.onload=startgallery </script>

Ahora para agregar se divide en dos partes :

Las tablas :

<div class="gallerycontent" subject="What is JavaScript?">

AQUI CONTENIDO

</div>

<div class="gallerycontent" subject="Java & JavaScript Differences">

AQUI CONTENIDO

</div>
<div class="gallerycontent" subject="What is DHTML?">

AQUI CONTENIDO

</div>

Y los botones y divs preferible no modifiques nada :


<div id="controldiv" style="display: none;" class="gallerycontroller">
<form name="gallerycontrol">
    <select class="gallerycontroller" size="3" name="menu" onChange="manualcontrol(this.options.selectedIndex)">
    <option>Blank form</option>
    </select><br />
    Auto:
<input type="radio" checked="" name="mode" value="auto" onClick="preparemode('auto')" />
Manual:
<input type="radio" name="mode" value="manual" onClick="preparemode('manual')" />
</form>
</div>

Textarea En marquesina (dynamicdrive.com)

Aqui el code :