Is it possible to change attribute properties in a style.css file using a jquery onclick event from html file?
I am using the below currently, but I would like to change the css file itself.
$('#demo').click(function(){
$(.#demo').slideUp();
this.style.backgroundColor = 'red';
});
You cannot edit the file itself. However, you can override styles a number of ways.
style element with the required rules and append to the document. (Example).css to change the desired properties. (Example).addClass and .removeClass. (Example)For the type of behavior you describe, you'd use #2 or #3 (#3 is recommended because it's the easiest to maintain). Here's #2 in practice using your example: http://jsfiddle.net/HackedByChinese/HTNGs/1/
$('#demo').click(function() {
$(this).css('background-color', 'red');
});
You cannot edit css file itself but can change or add css propreties.
Here is a DEMO to help YOU http://jsfiddle.net/Simplybj/EFsvz/2/
You can add muliple css properties to your html like
$('#demo').click(function(){
$(this).css({'background-color':'red','color':'white');
});
Or if you have css Class defined in style sheet like
.makeRed
{
background-color:red;
height:100px;
width:100px;
margin:5px;
}
.makeGreen{
background-color:green;
height:100px;
width:100px;
margin:5px;
}
And Markup like
<div id="me" class="makeRed"></div>
Then You can change class of div as
$('#me').click(function(){
$(this).removeClass('makeRed').addClass('makeGreen');
});
you cannot edit css file, if you want to edit css property/attribute then you have to use like this
$(this).css("name","value");
so for you, it will be $(this).css("background-color","red"); instead of this.style.backgroundColor = 'red';
You can't edit the CSS file using only jquery, but you can create a php script that can open/save the file, then pass the css changes to that script with jquery.
Checkout this link: http://api.jquery.com/jQuery.post/
You cannot edit files on the server from the client-side.
This is simply not possible due to security reasons, sorry.
There is an other method, define separate css classes with your changed and unchanged properties. Then using j query/ java script you can easily change class of the element. Hope it will work...
