PDA

View Full Version : Change the right things in CSS with Javascript



[Nicolas]
03-08-2011, 01:57 AM
Hello. I have an issue. I have finally found a CSS script to make a round image, but it doesn't use an SRC. It uses a CSS Background, and in the SRC of an image, I have to add a "nothing.png" which is a simple transparent background. But, even though it's cool, I don't know how to change the background by entering a link. The Code:

<img style="border:0px solid #fff;-moz-border-radius:200px;-webkit-border-radius:100px; background: url(circleimage.png);" width="200px" height="200px" src="nothing.png" id="roundimage">
and the way to change it:

<input type=text onchange="document.getElementById('roundimage').className ='foo'">
And last but not least, the class:

<style>
.foo {
border: 0px solid #fff;
-moz-border-radius: 200px;
-webkit-border-radius: 100px;
background: url(THIS IS WHAT THE USER ADDED INTO THE TEXT BOX);
}</style>
Again, what I need done is the user must add a link into a text box and it updates the round image with the CSS. Doesn't absolutely have to be the CSS background. If it will work. Please help, this will be amazing if it can work! Must update with JS, thanks!
-Nic
P.S. :
This is yet another generator, I know, probably a big fail. But please help me, I really would like for this to work. link: http://dbanimefree.x10.mx/llltest.html

azoomer
03-08-2011, 11:20 PM
Hi Nic, I can't help you with the question, but I thought I'd warn you about the -moz and -webkit - border radius. These rules will not work in internet explorer, and probably not in opera.

[Nicolas]
03-09-2011, 01:47 AM
Hi Nic, I can't help you with the question, but I thought I'd warn you about the -moz and -webkit - border radius. These rules will not work in internet explorer, and probably not in opera.

Yeah, I know. I will add the support to IE and Opera in it. Which I suppose is possible because it was in a DD script. Thanks though :)