Hi friends !
I've got a problem changing the stylesheets in a iframe inside my page.
Here's the Deal:
My page has 3 iframes inside a table, and I want to change the color of a class in one of them by clicking a button. The bgcolor of the document inside the iframe I change with no problems using a function like this:
function changebg() {
document.frames("frame2").document.body.style.backgroundColor = document.FormName.TextInput.value;
}
I use a form to retrieve the value of the bgcolor, and it's outside the iframes, and trigger it with a button with the onclick event that changes the bgcolor of the selected iframe.
But to change the color of the class (it is a class for some links in the page inside the iframe), I was trying to do something like this in the same function:
document.frames("frame2").document.classes.ClassName.style.Color = document.options.TextInput2.value;
and it was not working.
To change only the color of the text I can do by using the same syntax as the changebg() function, using body.style.Color, but since the class I want to change is used for links, I couldn't use this script.
Now here's the question:
Can I change a color value of a class in a stylesheet inside an iframe directly from the page? If yes ,how ?
And to change the color onhover?
Is it the same way to change bgimages ?
Am I using the correct syntax to access the class ?
I think that if I can change the value of the bgcolor atribute of the body in the stylesheet, I can assign a value to other classes in the stylesheet, but I'm not sure how. Can anybody help me ?Rather than doing all of that, try loading a new stylesheet for the iFrame when the button is clicked. That should do everything you're wanting I think... To load the new stylesheet you can either edit the tag that loaded the old one (I think), or you can just write some new code into the document to load the new stylesheet. This would all probably be easiest if the stylesheets were kept external.Thanks for the tip, but what I'm actually looking for is to change the stylesheets dinamically, without having to load a new style sheet into the page or change it into another class, if I do so, I'll have to write hundreds of stylesheets, one for each link color, and that's not a practical job to be done.
I've posted this into the javascript forum too, and there is a more practical solution to this case, I'll put the function below to help others that eventually have the same doubt.
function ChangeLinkColor(LinkIDGroup) {
var i=1;
while (document.getElementById(LinkIDGroup+i)) {
document.getElementById(LinkIDGroup+i).style.color = document.FormName.TextBoxName.value;
//document.getElementById(LinkIDGroup+i).style.SomeOtherAttribute=somethignelse...
i++;
}
}
and invoked the function with onclick="ChangeLinkColor('link');"
As i have to retrieve the value of the color from a textbox that is inputed by the user, I've found a way through it with this.
Thanks again for the tip.
I've got a problem changing the stylesheets in a iframe inside my page.
Here's the Deal:
My page has 3 iframes inside a table, and I want to change the color of a class in one of them by clicking a button. The bgcolor of the document inside the iframe I change with no problems using a function like this:
function changebg() {
document.frames("frame2").document.body.style.backgroundColor = document.FormName.TextInput.value;
}
I use a form to retrieve the value of the bgcolor, and it's outside the iframes, and trigger it with a button with the onclick event that changes the bgcolor of the selected iframe.
But to change the color of the class (it is a class for some links in the page inside the iframe), I was trying to do something like this in the same function:
document.frames("frame2").document.classes.ClassName.style.Color = document.options.TextInput2.value;
and it was not working.
To change only the color of the text I can do by using the same syntax as the changebg() function, using body.style.Color, but since the class I want to change is used for links, I couldn't use this script.
Now here's the question:
Can I change a color value of a class in a stylesheet inside an iframe directly from the page? If yes ,how ?
And to change the color onhover?
Is it the same way to change bgimages ?
Am I using the correct syntax to access the class ?
I think that if I can change the value of the bgcolor atribute of the body in the stylesheet, I can assign a value to other classes in the stylesheet, but I'm not sure how. Can anybody help me ?Rather than doing all of that, try loading a new stylesheet for the iFrame when the button is clicked. That should do everything you're wanting I think... To load the new stylesheet you can either edit the tag that loaded the old one (I think), or you can just write some new code into the document to load the new stylesheet. This would all probably be easiest if the stylesheets were kept external.Thanks for the tip, but what I'm actually looking for is to change the stylesheets dinamically, without having to load a new style sheet into the page or change it into another class, if I do so, I'll have to write hundreds of stylesheets, one for each link color, and that's not a practical job to be done.
I've posted this into the javascript forum too, and there is a more practical solution to this case, I'll put the function below to help others that eventually have the same doubt.
function ChangeLinkColor(LinkIDGroup) {
var i=1;
while (document.getElementById(LinkIDGroup+i)) {
document.getElementById(LinkIDGroup+i).style.color = document.FormName.TextBoxName.value;
//document.getElementById(LinkIDGroup+i).style.SomeOtherAttribute=somethignelse...
i++;
}
}
and invoked the function with onclick="ChangeLinkColor('link');"
As i have to retrieve the value of the color from a textbox that is inputed by the user, I've found a way through it with this.
Thanks again for the tip.