martes, 8 de mayo de 2007

Cambiar propiedades Style de un texto con Javascript

"No hay verdad si no hay mentira. No hay muerte si no hay vida. No hay amor sin ningún odio. No hay nada, si no hay todo."
Todo/Nada -Azrael
Copypasteado de Daikrieg

Ejemplos de instrucciones con Javascript para cambiar las propiedades style de un texto.

Ocultar un texto llamando a una id concreta con un botón

Por ejemplo, queremos ocultar el siguiente texto:
Me gustan las tetas gordas y, cuanto más gordas, mejor.

Para ello, lo vamos a escribir dándole la id 'texto' (por ejemplo, con un tag div) y vamos a añadir la siguiente función script (ya sea en el mismo html o desde una hoja .js):
function cambiarpropiedad()
/*Utilizamos una función if para que, al volver a clicar el botón, vuelva a verse el texto*/
if (document.getElementById('texto').style.display == 'none')
document.getElementById('texto').style.display = 'block';
} else {
document.getElementById('texto').style.display = 'none';

Luego, añadiríamos un botón que llamase a esta función, quedando el código html algo así:
<div id="texto">Me gustan las tetas gordas y, cuanto más gordas, mejor.</div>
<input type="button" value="Cambia el color del texto superior" onclick="cambiarpropiedad()" />

Ocultar un texto llamando a una id cualquiera con un botón

Sólo habría que cambiar, en la función Javascript, el 'texto' por el nombre de una variable cualquiera (en este caso escogemos var1) y luego añadir el nombre de la variable en la declaración de las funciones.

El código quedaría algo así:
unction cambiarpropiedad(var1)
if (document.getElementById(var1).style.display == 'none')
document.getElementById(var1).style.display = 'block';
} else {
document.getElementById(var1).style.display = 'none';

<div id="texto">Me gustan las tetas gordas y, cuanto más gordas, mejor.</div>
<input type="button" value="Cambia el color del texto superior" onclick="cambiarpropiedad('texto')" />
<!-- En este caso, el botón sólo está para la id texto pero la declaración de variable permite reutilizar la función para más botones o textos.-->

Otros cambios de propiedades

Con Javascript podemos modificar cualquier otro tipo de propiedad del tag que sea. Tan sólo hay que modificar de la función document.getElementById(variable).style.display la parte correspondida a .style.display. Por ejemplo, para cambiar el color de fondo, habría que poner: .style.backgroundColor. Si fuese un enlace y quisiésemos cambiar la dirección habríamos de poner .href.

Las posibilidades de modificar el código html con Javascript son, incluso para un iniciado, ilimitadas.

10 comentarios:

Anónimo dijo...

Hi again, see tthis is the site i told you i signed up to. It has some nice information about how to make money using OPP, i think you might find it interesting. here it is. bye!

El Moderador dijo...

Intercambiamos Enlaces?

Si es de su interes por favor dejar un mensaje en el blog



Anónimo dijo... free hardcore porno galleries 3d anime porn clips double penetration porn clips

Anónimo dijo...

lipitor nursing implications
lipitor kidney stones
lipitor copay card 2009
lipitor and muscle pain
how much does lipitor cost without insurance

lipitor kidney failure
lipitor orange juice
lipitor niacin interaction

ciprofloxacin antibiotic
buy cipro no prescriptions
where can i buy cipro
cipro hc otic
diflucan and cipro interaction

interaction of cipro and metformin
cipro online order

nolvadex unethical
nolvadex indications
gynecomastia treatments nolvadex
where to buy nolvadex
side effects nolvadex

nolvadex gaurente
post steroids nolvadex
hcg increase level nolvadex

purchase nolvadex cheap online
nolvadex pils
nolvadex indications
mail order nolvadex
nolvadex during cycle

Anónimo dijo...

It’s funny how many articles and news come out on a weekly basis.
watch harry potter and deathly hallows online free

Anónimo dijo...

great blog If you are the type to update your blog regulary, then you have gained one daily reader in me today. keep up the super work.
watch harry potter and deathly hallows online

Anónimo dijo...

After getting more than 10000 visitors/day to my website I thought your website also need unstoppable flow of traffic...

Use this BRAND NEW software and get all the traffic for your website you will ever need ...

= = > >

In testing phase it generated 867,981 visitors and $540,340.

Then another $86,299.13 in 90 days to be exact. That's $958.88 a

And all it took was 10 minutes to set up and run.

But how does it work??

You just configure the system, click the mouse button a few
times, activate the software, copy and paste a few links and
you're done!!

Click the link BELOW as you're about to witness a software that
could be a MAJOR turning point to your success.

= = > >

Anónimo dijo...

The articleice Machines introduces:This article about How To Buy Commercial Ice Machines For Restaurant,With the introduction of cutting edge and innovative technologies, a commercial ice machine is no longer a bulky device producing insanitation, consuming a lot ...

If you need more ice Machines infomation about How To Buy Commercial Ice Machines For Restaurant, Click here to find.

With the introduction of cutting ice Machines edge and innovative technologies, a commercial ice machine is no longer a bulky device producing insanitation, consuming a lot of energy, making noise, and taking a lot of time to make the needed supply of ice. As a result of high end technologies, commercial ice machines are able to achieve “being green” the highest levels of energy and water conservation. Now a commercial ice machine can easily produce from 65 pounds to 2,000 pounds of ice cubes in a day. You can find varied shapes of ice cubes such as dice, half dice, octagon, crushed, nugget, and flake.

Commercial ice machines are the standalone units,ice Machines designed to produce large quantities of ice for various commercial purposes. Once installed, these commercial ice makers are pretty automatic and do not need much attention from you or your staff. These factory-made machines consist of a condensing unit and ice-making section that operates as an integrated unit to make ice, an ice bin or a storage unit to store the created ice and a dispensing unit to dispense the ice out of the machine. Many automatic ice machines use moving water to create an improved quality of ice cubes. They work on the principle of “faster the water moves the better the ice quality becomes”. In this process, the air and un-dissolved solids get washed away. This results in pure and clear ice production.

Large amounts of ice are demanded for various purposes in many ice Machines commercial entities such as Restaurants, Bars, Ice Cream Parlors, Bakeries, Country Clubs and Golf Courses. A commercial ice machine is the perfect choice for such places as the large quantity of ice also needs to be a certain quality as well. Automatic commercial ice machines will make plenty of ice of equal size in a short span of time. All you need to do is just start the machine and set the required functions, and leave the rest up to the machine. You will get good quantity of quality ice in a short amount of time. In addition, many commercial ice machines come with a self cleaning function. This will help maintain the quality and quantity if the produced ice while decreasing the time that you and or your staff must spend with the machine.

Keep in mind that there are two varieties of ice machines: air cooled and waterice Machines cooled. Air cooled ice machines use air to disperse the heat, whereas water cooled ice machine uses water to do the same function. Air cooled ice machines use more energy and also are much noisier than water cooled ice machines. However, they are more affordable than water cooled ice machines.

An assorted collection of wonderful, fast and energy efficient commercial ice makers are readilyice Machines available in the market. Various renowned and reliable manufacturers have come up with their unique range of these amazing machines. Numerous models that create different types and sizes of ice are available in the local and online market. A competitive urge of creating more efficient and cost effective ice machines, has left the customers and consumers with a distinctive variety of these units in which to choose.

Anónimo dijo...

single dating in sachsen christian dating london
russian dating sites rated [url=]dating sites from eroupe[/url] dating usa teenage
who is dave batista dating [url=]great dating quotes[/url] ali dating jared morgenstern [url=]anwar_ijaz[/url] mature women online dating

Anónimo dijo...

coincidimos en el gusto x las tetas gordas.
un abrazo.