changing style sheet

through drop down list one should be able to change the style sheet

Page 1 of 1

10 Replies - 804 Views - Last Post: 20 October 2009 - 09:18 AM

#1 ramesh866  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 91
  • Joined: 03-October 09

changing style sheet

Posted 19 October 2009 - 11:51 AM

i tried with the below coding
if (DropDownList1.SelectedValue == "0")
		{
			styleLink.Href = "pleasant.css";
		}
		else  if (DropDownList1.SelectedValue == "1")
		{
			styleLink.ID = "styleLink";
			styleLink.Href = "rock.css";
		}


the first being the default. but when i click the second option (rock) there is no effect. the default is still displayed.what is the problem over here?

Is This A Good Question/Topic? 0
  • +

Replies To: changing style sheet

#2 MacAnimeGirl  Icon User is offline

  • D.I.C Regular

Reputation: 9
  • View blog
  • Posts: 282
  • Joined: 30-September 08

Re: changing style sheet

Posted 19 October 2009 - 12:02 PM

may I see the code to the element this is for?
Was This Post Helpful? 0
  • +
  • -

#3 ramesh866  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 91
  • Joined: 03-October 09

Re: changing style sheet

Posted 19 October 2009 - 12:06 PM

sure............this comes under the head tag
<link  id="styleLink" rel="stylesheet" type="text/css" href="pleasant.css" />



Was This Post Helpful? 0
  • +
  • -

#4 BetaWar  Icon User is offline

  • #include "soul.h"
  • member icon

Reputation: 1199
  • View blog
  • Posts: 7,307
  • Joined: 07-September 06

Re: changing style sheet

Posted 19 October 2009 - 12:09 PM

Try something like so:

<link rel="stylesheet" id="css" href="default.css" />
<script>
  function swapCSS(value){
	document.getElementById("css").href = value+".css";
  }
</script>

<select onchange="swapCSS(this.value)">
  <option value="default">Default</option>
  <option value="dark">Dark</option>
</select>

This is a test


Where default, and dark are the names of css files located in the same folder.

It works for me in all major browsers,

Hope that helps.
Was This Post Helpful? 1
  • +
  • -

#5 MacAnimeGirl  Icon User is offline

  • D.I.C Regular

Reputation: 9
  • View blog
  • Posts: 282
  • Joined: 30-September 08

Re: changing style sheet

Posted 19 October 2009 - 12:13 PM

View PostBetaWar, on 19 Oct, 2009 - 11:09 AM, said:

Try something like so:

<link rel="stylesheet" id="css" href="default.css" />
<script>
  function swapCSS(value){
	document.getElementById("css").href = value+".css";
  }
</script>

<select onchange="swapCSS(this.value)">
  <option value="default">Default</option>
  <option value="dark">Dark</option>
</select>

This is a test


Where default, and dark are the names of css files located in the same folder.

It works for me in all major browsers,

Hope that helps.


Simple and clever. I like it!
Was This Post Helpful? 0
  • +
  • -

#6 ramesh866  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 91
  • Joined: 03-October 09

Re: changing style sheet

Posted 19 October 2009 - 12:18 PM

that helped.
thanks brothers
Was This Post Helpful? 0
  • +
  • -

#7 ramesh866  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 91
  • Joined: 03-October 09

Re: changing style sheet

Posted 20 October 2009 - 12:20 AM

it worked, but a problem is there. once the page is postback the css is again set to default one.
Was This Post Helpful? 0
  • +
  • -

#8 MacAnimeGirl  Icon User is offline

  • D.I.C Regular

Reputation: 9
  • View blog
  • Posts: 282
  • Joined: 30-September 08

Re: changing style sheet

Posted 20 October 2009 - 06:26 AM

If the value default is set to default (as in it will be the value automatically selected on load) then it will do that.

You may want to consider having the default being set to whatever was last selected.

Say it's on default and I change it to dark, you would need to then set dark as the default.

Sorry if it's confusing. Let me know and I'll see if I can expand upon it.

This post has been edited by MacAnimeGirl: 20 October 2009 - 06:28 AM

Was This Post Helpful? 0
  • +
  • -

#9 BetaWar  Icon User is offline

  • #include "soul.h"
  • member icon

Reputation: 1199
  • View blog
  • Posts: 7,307
  • Joined: 07-September 06

Re: changing style sheet

Posted 20 October 2009 - 08:17 AM

You could use a cookie to hold the last selected value of the selection box and use a function onload to change the selection box's selected value as well as the stylesheet of the page.

If you have access to server side scripting (PHP or ASP, etc.) you could just have a simple ajax call made every time the stylesheet changes that updates a cookie on the server side so you can load the stylesheet in instead of default before the page ever gets sent to the user.
Was This Post Helpful? 0
  • +
  • -

#10 MacAnimeGirl  Icon User is offline

  • D.I.C Regular

Reputation: 9
  • View blog
  • Posts: 282
  • Joined: 30-September 08

Re: changing style sheet

Posted 20 October 2009 - 08:21 AM

Hey Beta, couldn't a partial page update be done if he was using ASP.NET and AJAX?
Was This Post Helpful? 0
  • +
  • -

#11 ramesh866  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 91
  • Joined: 03-October 09

Re: changing style sheet

Posted 20 October 2009 - 09:18 AM

i have no idea about ajax.. but cookie is a good idea or a hidden field can be used to store. right?
thanks brothers
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1