1

I am looking to have a toggle button that will write to a CSS file on the server and switch between visibility:hidden; and visibility:visible on a DIV named building1

I cannot use a style sheet switcher because there will be quite a few of these buttons and DIVS .....it needs to write to the style sheet so the changes will be visible to other users.

Thank You in advance!
Philip
  • 27
  • 7

2 Answers2

0

I think that this link should help you out. It appends to the stylesheet. I definately think that jquery is the way to go. Or you could go for this Q/A

Community
  • 1
  • 1
Daniel Casserly
  • 3,552
  • 2
  • 29
  • 60
0

If you want the changes to be visible to other users, you'll need to make a call-back to your server so the server can modify the css file.

Example (probably not top-notch, but it works): https://gist.github.com/canihavesomecoffee/4d99b82503e044baaa6d933a7910c82c. I'll have to warn you though, using this way can cause quite a lot of stress on your server if it's called a lot. In that case you'd probably want to select all different ones in one form and submit that once instead of a call for each button.

canihavesomecoffee
  • 163
  • 4
  • 19
  • I'll write one when I'm back home (in an hour or so) from school and if none has been that kind to write one in the mean time :) – canihavesomecoffee Jan 03 '12 at 16:58
  • @Philip Do you mean the css is composed dynamically upon call from webserver, cached in some way or is it totally static? – canihavesomecoffee Jan 03 '12 at 16:59
  • It is static, that would be really cool of you! I would like to have 1 page that has 5 of these buttons that will toggle or write to the style sheet for the 5 different Divs. – Philip Jan 03 '12 at 17:05
  • When I use your example on my server, I get an error that something went wrong...I will keep trying it, however I have a question. How could I make it so that when the page loads it will look to the current state of the button to determine if the Div should be visible or not visible...that way if the button is clicked to off...the div will stay off. I am thinking that an admin will have access to the toggle buttons on a separate page ...not actually on the same page as the DIVS. – Philip Jan 04 '12 at 03:45
  • @Philip It's good to separate it. The initial state of the button could be set by calling a javascript function when loading the page, or parsing the css file with php. What is the error you're getting btw? – canihavesomecoffee Jan 04 '12 at 09:45
  • when I saved down the page of your working example it saved .html pages...are they supposed to be PHP pages? I changed them to PHP pages... Have a look at the my example that does not work. Also, are you for hire? – Philip Jan 05 '12 at 15:28
  • Actually there is a html file (the one I linked to), and a php file (which you can see in the iframe). The html is purely to show the javascript code and the result, in your case the button and javascript function would be on an admin page, and the divs obviously in the site. I'll be modifiying the example in a couple of minutes too to reflect the state (visible/hidden) on page load in the button. For the question about the hiring: normally I'd say yes, but I have exams in a couple of weeks so it wouldn't be for straight away. – canihavesomecoffee Jan 05 '12 at 15:58
  • I works great on your server, but I get an error. [link] http://ireneagapion.com/test/changeCSS.html – Philip Jan 05 '12 at 17:26
  • @Philip The html file you have (test/changeCSS.html) contains code that makes an ajax call to http://ireneagapion.com/test/changeCSS.php?visible=true&elem=toggle, which doesn't exist and thus gives the alert. The solution is to place the php file in the test folder. – canihavesomecoffee Jan 05 '12 at 20:10