Changing an CSS Property for once at opening of the website [closed]

-1

I am trying to change a style of a class just once when the website is opened. How can I do this with css?

asked Nov 15 '18 at 6:30

beginner_

114

closed as unclear what you're asking by fubar, Saeed.Ataee, LGSon, Shree, Makyen Nov 15 '18 at 6:55

Please clarify your specific problem or add additional details to highlight exactly what you need. As it's currently written, it’s hard to tell exactly what you're asking. See the How to Ask page for help clarifying this question. If this question can be reworded to fit the rules in the help center, please edit the question.

1

be more specific while asking a question, share your code tell us what you did and what you expected, what is happening etc

– Towkir Ahmed
Nov 15 '18 at 6:31

css would be loaded immediately on website load though?

– Mukyuu
Nov 15 '18 at 6:31

Welcome to stackoverflow. Did you try triggering javascript code that runs once the page is finished loading? One way to do that is <body onload='my_function()'>

– Ahmad
Nov 15 '18 at 6:32

add a comment |

-1

I am trying to change a style of a class just once when the website is opened. How can I do this with css?

asked Nov 15 '18 at 6:30

beginner_

114

closed as unclear what you're asking by fubar, Saeed.Ataee, LGSon, Shree, Makyen Nov 15 '18 at 6:55

1

be more specific while asking a question, share your code tell us what you did and what you expected, what is happening etc

– Towkir Ahmed
Nov 15 '18 at 6:31

css would be loaded immediately on website load though?

– Mukyuu
Nov 15 '18 at 6:31

Welcome to stackoverflow. Did you try triggering javascript code that runs once the page is finished loading? One way to do that is <body onload='my_function()'>

– Ahmad
Nov 15 '18 at 6:32

add a comment |

-1

I am trying to change a style of a class just once when the website is opened. How can I do this with css?

asked Nov 15 '18 at 6:30

beginner_

114

I am trying to change a style of a class just once when the website is opened. How can I do this with css?

javascript css

asked Nov 15 '18 at 6:30

beginner_

114

asked Nov 15 '18 at 6:30

beginner_

114

asked Nov 15 '18 at 6:30

beginner_

114

asked Nov 15 '18 at 6:30

beginner_

114

asked Nov 15 '18 at 6:30

beginner_

114

closed as unclear what you're asking by fubar, Saeed.Ataee, LGSon, Shree, Makyen Nov 15 '18 at 6:55

1

be more specific while asking a question, share your code tell us what you did and what you expected, what is happening etc

– Towkir Ahmed
Nov 15 '18 at 6:31

css would be loaded immediately on website load though?

– Mukyuu
Nov 15 '18 at 6:31

Welcome to stackoverflow. Did you try triggering javascript code that runs once the page is finished loading? One way to do that is <body onload='my_function()'>

– Ahmad
Nov 15 '18 at 6:32

add a comment |

1

be more specific while asking a question, share your code tell us what you did and what you expected, what is happening etc

– Towkir Ahmed
Nov 15 '18 at 6:31

css would be loaded immediately on website load though?

– Mukyuu
Nov 15 '18 at 6:31

Welcome to stackoverflow. Did you try triggering javascript code that runs once the page is finished loading? One way to do that is <body onload='my_function()'>

– Ahmad
Nov 15 '18 at 6:32

be more specific while asking a question, share your code tell us what you did and what you expected, what is happening etc

– Towkir Ahmed
Nov 15 '18 at 6:31

css would be loaded immediately on website load though?

– Mukyuu
Nov 15 '18 at 6:31

Welcome to stackoverflow. Did you try triggering javascript code that runs once the page is finished loading? One way to do that is <body onload='my_function()'>

– Ahmad
Nov 15 '18 at 6:32

add a comment |

1 Answer
1

active

oldest

votes

You could use jQuery function $(document).ready() to trigger css style changing after the page has loaded.

$(document).ready(function(){

  $('h1.to_change').css("color","blue");

});

h1 { color: red }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>





<h1 class='to_stay'>This is a red header</h1>

<h1 class='to_change'>This was a red header</h1>

edited Nov 15 '18 at 6:44

answered Nov 15 '18 at 6:37

Ahmad

8,28043663

It can be without js only css....

– לבני מלכה
Nov 15 '18 at 6:51

@לבנימלכה can you elaborate? the OP requested the css to be changed after the page has loaded, meaning to override the original css

– Ahmad
Nov 15 '18 at 6:54

so use h1{color:red} and .to_change{color:blue}

– לבני מלכה
Nov 15 '18 at 6:55

2

@לבנימלכה I know it can be done from css file. put the OP requested to change the style after the CSS is done loading. I only made this as an example. He did not ask for this particular change

– Ahmad
Nov 15 '18 at 6:59

add a comment |

1 Answer
1

active

oldest

votes

1 Answer
1

active

oldest

votes

You could use jQuery function $(document).ready() to trigger css style changing after the page has loaded.

$(document).ready(function(){

  $('h1.to_change').css("color","blue");

});

h1 { color: red }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>





<h1 class='to_stay'>This is a red header</h1>

<h1 class='to_change'>This was a red header</h1>

edited Nov 15 '18 at 6:44

answered Nov 15 '18 at 6:37

Ahmad

8,28043663

It can be without js only css....

– לבני מלכה
Nov 15 '18 at 6:51

@לבנימלכה can you elaborate? the OP requested the css to be changed after the page has loaded, meaning to override the original css

– Ahmad
Nov 15 '18 at 6:54

so use h1{color:red} and .to_change{color:blue}

– לבני מלכה
Nov 15 '18 at 6:55

2

@לבנימלכה I know it can be done from css file. put the OP requested to change the style after the CSS is done loading. I only made this as an example. He did not ask for this particular change

– Ahmad
Nov 15 '18 at 6:59

add a comment |

You could use jQuery function $(document).ready() to trigger css style changing after the page has loaded.

$(document).ready(function(){

  $('h1.to_change').css("color","blue");

});

h1 { color: red }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>





<h1 class='to_stay'>This is a red header</h1>

<h1 class='to_change'>This was a red header</h1>

edited Nov 15 '18 at 6:44

answered Nov 15 '18 at 6:37

Ahmad

8,28043663

It can be without js only css....

– לבני מלכה
Nov 15 '18 at 6:51

@לבנימלכה can you elaborate? the OP requested the css to be changed after the page has loaded, meaning to override the original css

– Ahmad
Nov 15 '18 at 6:54

so use h1{color:red} and .to_change{color:blue}

– לבני מלכה
Nov 15 '18 at 6:55

2

@לבנימלכה I know it can be done from css file. put the OP requested to change the style after the CSS is done loading. I only made this as an example. He did not ask for this particular change

– Ahmad
Nov 15 '18 at 6:59

add a comment |

You could use jQuery function $(document).ready() to trigger css style changing after the page has loaded.

$(document).ready(function(){

  $('h1.to_change').css("color","blue");

});

h1 { color: red }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>





<h1 class='to_stay'>This is a red header</h1>

<h1 class='to_change'>This was a red header</h1>

edited Nov 15 '18 at 6:44

answered Nov 15 '18 at 6:37

Ahmad

8,28043663

You could use jQuery function $(document).ready() to trigger css style changing after the page has loaded.

$(document).ready(function(){

  $('h1.to_change').css("color","blue");

});

h1 { color: red }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>





<h1 class='to_stay'>This is a red header</h1>

<h1 class='to_change'>This was a red header</h1>

$(document).ready(function(){

  $('h1.to_change').css("color","blue");

});

h1 { color: red }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>





<h1 class='to_stay'>This is a red header</h1>

<h1 class='to_change'>This was a red header</h1>

$(document).ready(function(){

  $('h1.to_change').css("color","blue");

});

h1 { color: red }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>





<h1 class='to_stay'>This is a red header</h1>

<h1 class='to_change'>This was a red header</h1>

edited Nov 15 '18 at 6:44

answered Nov 15 '18 at 6:37

Ahmad

8,28043663

edited Nov 15 '18 at 6:44

answered Nov 15 '18 at 6:37

Ahmad

8,28043663

answered Nov 15 '18 at 6:37

Ahmad

8,28043663

answered Nov 15 '18 at 6:37

Ahmad

8,28043663

It can be without js only css....

– לבני מלכה
Nov 15 '18 at 6:51

@לבנימלכה can you elaborate? the OP requested the css to be changed after the page has loaded, meaning to override the original css

– Ahmad
Nov 15 '18 at 6:54

so use h1{color:red} and .to_change{color:blue}

– לבני מלכה
Nov 15 '18 at 6:55

2

@לבנימלכה I know it can be done from css file. put the OP requested to change the style after the CSS is done loading. I only made this as an example. He did not ask for this particular change

– Ahmad
Nov 15 '18 at 6:59

add a comment |

It can be without js only css....

– לבני מלכה
Nov 15 '18 at 6:51

@לבנימלכה can you elaborate? the OP requested the css to be changed after the page has loaded, meaning to override the original css

– Ahmad
Nov 15 '18 at 6:54

so use h1{color:red} and .to_change{color:blue}

– לבני מלכה
Nov 15 '18 at 6:55

2

@לבנימלכה I know it can be done from css file. put the OP requested to change the style after the CSS is done loading. I only made this as an example. He did not ask for this particular change

– Ahmad
Nov 15 '18 at 6:59

It can be without js only css....

– לבני מלכה
Nov 15 '18 at 6:51

@לבנימלכה can you elaborate? the OP requested the css to be changed after the page has loaded, meaning to override the original css

– Ahmad
Nov 15 '18 at 6:54

so use h1{color:red} and .to_change{color:blue}

– לבני מלכה
Nov 15 '18 at 6:55

@לבנימלכה I know it can be done from css file. put the OP requested to change the style after the CSS is done loading. I only made this as an example. He did not ask for this particular change

– Ahmad
Nov 15 '18 at 6:59

add a comment |

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Vfrdtyky