Changing a stylesheet on the fly and saving it with PHP

Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
Reply

Join Date: Jul 2007
Posts: 18
Reputation: Lucrezia is an unknown quantity at this point 
Solved Threads: 0
Lucrezia Lucrezia is offline Offline
Newbie Poster

Changing a stylesheet on the fly and saving it with PHP

 
0
  #1
Aug 22nd, 2007
Hello all!
I am using some javascript code to change some classes of an external stylesheet on the fly. Is there any way (a variable perhaps?) to access the changed stylesheet so that I store it afterwards with php, or should I rebuild it again (according to the options of the user) with my php code in order to save it?

Thanks in advance
Reply With Quote Quick reply to this message  
Join Date: May 2006
Posts: 1,422
Reputation: stymiee is on a distinguished road 
Solved Threads: 35
Moderator
stymiee's Avatar
stymiee stymiee is offline Offline
He's No Good To Me Dead

Re: Changing a stylesheet on the fly and saving it with PHP

 
0
  #2
Aug 22nd, 2007
Save the chosen stylesheet in a cookie. Then PHP can spit out the chosen stylesheet for all new page loads.
John Conde
Brainyminds | Merchant Account Services | I Love Code
IT'S HERE: Merchant Accounts 101 Everything you need to know about merchant accounts!
Reply With Quote Quick reply to this message  
Join Date: Sep 2005
Posts: 1,075
Reputation: digital-ether is just really nice digital-ether is just really nice digital-ether is just really nice digital-ether is just really nice 
Solved Threads: 66
Moderator
digital-ether's Avatar
digital-ether digital-ether is offline Offline
Veteran Poster

Re: Changing a stylesheet on the fly and saving it with PHP

 
0
  #3
Aug 23rd, 2007
Originally Posted by Lucrezia View Post
Hello all!
I am using some javascript code to change some classes of an external stylesheet on the fly. Is there any way (a variable perhaps?) to access the changed stylesheet so that I store it afterwards with php, or should I rebuild it again (according to the options of the user) with my php code in order to save it?

Thanks in advance
Do you mean you're changing the DOM representation of the Style Sheet?

IE has a (string) cssText property of the Stylesheet Object. FF/NN has a cssText property of each StyleSheet Object's cssRules (Array) Property.

eg:

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. function myCssText(StyleSheet) {
  2. var text = '';
  3. if (typeof (StyleSheet.cssText) == 'string') {
  4. return StyleSheet.cssText;
  5. } else {
  6. for(var i = 0; i < StyleSheet.cssRules.length; i++) {
  7. text += StyleSheet.cssRules[i].cssText;
  8. }
  9. }
  10. return text;
  11. }
  12.  
  13. // eg
  14. alert(myCssText(document.styleSheets[0]));
www.fijiwebdesign.com - web design and development and fun
Cpanel Email - Let users Register email accounts on your website upon registration
Ajax Chat - Fully browser based chat!
Reply With Quote Quick reply to this message  
Join Date: Jul 2007
Posts: 18
Reputation: Lucrezia is an unknown quantity at this point 
Solved Threads: 0
Lucrezia Lucrezia is offline Offline
Newbie Poster

Re: Changing a stylesheet on the fly and saving it with PHP

 
0
  #4
Aug 23rd, 2007
Originally Posted by digital-ether View Post
Do you mean you're changing the DOM representation of the Style Sheet?

IE has a (string) cssText property of the Stylesheet Object. FF/NN has a cssText property of each StyleSheet Object's cssRules (Array) Property.

eg:

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. function myCssText(StyleSheet) {
  2. var text = '';
  3. if (typeof (StyleSheet.cssText) == 'string') {
  4. return StyleSheet.cssText;
  5. } else {
  6. for(var i = 0; i < StyleSheet.cssRules.length; i++) {
  7. text += StyleSheet.cssRules[i].cssText;
  8. }
  9. }
  10. return text;
  11. }
  12.  
  13. // eg
  14. alert(myCssText(document.styleSheets[0]));
Thank you so much!
Reply With Quote Quick reply to this message  
Join Date: Sep 2005
Posts: 1,075
Reputation: digital-ether is just really nice digital-ether is just really nice digital-ether is just really nice digital-ether is just really nice 
Solved Threads: 66
Moderator
digital-ether's Avatar
digital-ether digital-ether is offline Offline
Veteran Poster

Re: Changing a stylesheet on the fly and saving it with PHP

 
0
  #5
Aug 23rd, 2007
you're most welcome...
www.fijiwebdesign.com - web design and development and fun
Cpanel Email - Let users Register email accounts on your website upon registration
Ajax Chat - Fully browser based chat!
Reply With Quote Quick reply to this message  
Join Date: Jul 2007
Posts: 18
Reputation: Lucrezia is an unknown quantity at this point 
Solved Threads: 0
Lucrezia Lucrezia is offline Offline
Newbie Poster

Re: Changing a stylesheet on the fly and saving it with PHP

 
0
  #6
Sep 17th, 2007
I just finished my code for manipulating the css, and started on the Save part.
Scaringly enough I noticed that only IE (!) got the css right (it only capitalized the css property names, which was easily overcome with a .toLowerCase() ).
Mozilla firefox (so far I've tested with Mozilla, Safari and IE7) got it so wrong that it would probably work only in itself, adding proprietary css properties all over the place, removing others etc!!
Safari also changed it a bit, but its ok, nothing extreme there.
Is there a way I can easily overcome this with firefox, or the only way is to manipulate the string in my php code after grabbing it?

Thanks in advance..
Last edited by Lucrezia; Sep 17th, 2007 at 9:22 pm.
Reply With Quote Quick reply to this message  
Join Date: Sep 2005
Posts: 1,075
Reputation: digital-ether is just really nice digital-ether is just really nice digital-ether is just really nice digital-ether is just really nice 
Solved Threads: 66
Moderator
digital-ether's Avatar
digital-ether digital-ether is offline Offline
Veteran Poster

Re: Changing a stylesheet on the fly and saving it with PHP

 
0
  #7
Sep 17th, 2007
You mean like all the moz-example: blabla; crap that mozilla adds to it?
I'd just have a String.replace() anything that starts with moz- so you don't save it.

Is there any common property to what safari adds that can be used to remove it with a regular expression?

Could you post some examples from your tests?
www.fijiwebdesign.com - web design and development and fun
Cpanel Email - Let users Register email accounts on your website upon registration
Ajax Chat - Fully browser based chat!
Reply With Quote Quick reply to this message  
Join Date: Jul 2007
Posts: 18
Reputation: Lucrezia is an unknown quantity at this point 
Solved Threads: 0
Lucrezia Lucrezia is offline Offline
Newbie Poster

Re: Changing a stylesheet on the fly and saving it with PHP

 
0
  #8
Sep 18th, 2007
Yes, I meant the -moz- stuff but not only them, they are the least nagging things about it.
Mozilla changes the separate definitions of for example background-color, background-image, bakground-repeat etc making them into one (background) which in my case is undesirable, as there will be problems when my script tries to edit the saved css again (same goes with border afaik but luckily not with font). Safari does the opposite, breaking border styles into border-left-style,border-right-style etc.
I can think of a workaround for these, but I've noticed that firefox removes some css properties, and that's what scares me the most. It converted this class:
.transparent
{
filter:alpha(opacity=60);
-moz-opacity: 0.6;
opacity: 0.6;
}


to this:
.transparent
{
opacity: 0.6;
}


and ok, this particular class is not important, it will be in a different stylesheet in the future anyways. But it kinda scares me to see ff removing css rules...
The good thing is that this (.transparent) is the only class in the stylesheet which contains browser-specific css rules, so hopefully it won't do it to the other classes as well...
Reply With Quote Quick reply to this message  
Join Date: Jul 2007
Posts: 18
Reputation: Lucrezia is an unknown quantity at this point 
Solved Threads: 0
Lucrezia Lucrezia is offline Offline
Newbie Poster

Re: Changing a stylesheet on the fly and saving it with PHP

 
0
  #9
Sep 22nd, 2007
I wrote down all those browser pecularities that I noticed regarding the css.
I'm posting them here, in case they help somebody and in case somebody can help me.

Mozilla firefox for Windows
-Adds proprietary css properties (-moz-something)
-Converts background-image:, background-repeat: etc into background:
-Converts hex color values into RGB ones
-Removes CSS comments
-Removes the properties filter: and -moz-opacity:

Safari for Windows

-Converts hex color values into RGB ones
-Breaks background-position into background-position-x/y (which firefox does not support!!)
-Adds proprietary css properties (-webkit-something)
-Adds background-image/repeat/attachment/position-x/position-y even if they are not defined
-Breaks padding and margin into margin/padding-top/left/right/bottom
-Removes quotes from fonts with blanks in their names (in property font-family).
-Removes CSS comments
-Breaks overflow into overflow-x/y
-Breaks border-something into border-top/left/bottom/right-something
-Removes the properties filter: and -moz-opacity:


Opera for Windows
-Adds background-image/repeat/attachment/position-x/position-y even if they are not defined
-Breaks padding and margin into margin/padding-top/left/right/bottom
-Converts single quotes to double quotes from fonts with blanks in their names (in property font-family)
-Breaks border-something into border-top/left/bottom/right-something
-Removes CSS comments
-Converts relative to absolute URLs
-Removes the properties filter: and -moz-opacity:
-Removes the ; characters from the last css rule


IE for Windows
-Capitalizes the css property names
-Breaks padding into padding-top/left/right/bottom
-Removes the ; characters from the last css rule
-Converts border-width, border-style, border-color to border-left/top/bottom/right


The pecularities I have marked in red are a problem for my script
Last edited by Lucrezia; Sep 22nd, 2007 at 8:30 pm.
Reply With Quote Quick reply to this message  
Join Date: Jan 2007
Posts: 3,203
Reputation: MidiMagic has a spectacular aura about MidiMagic has a spectacular aura about 
Solved Threads: 164
MidiMagic's Avatar
MidiMagic MidiMagic is offline Offline
Nearly a Senior Poster

Re: Changing a stylesheet on the fly and saving it with PHP

 
0
  #10
Sep 22nd, 2007
Mozilla (FF and NS) REQUIRES all style properties to be in the correct case for the DOM and Doctype used.

IE often allows incorrect case in styles and tags.

You can't expect to use internal representations of things, because they are proprietary.
Daylight-saving time uses more gasoline
Reply With Quote Quick reply to this message  
Reply

This thread is more than three months old.
Perhaps start a new thread instead?
Message:



Similar Threads
Other Threads in the JavaScript / DHTML / AJAX Forum
Thread Tools Search this Thread



About Us | Contact Us | Advertise | DaniWeb | Acceptable Use Policy | RSS Feed

©2003 - 2009 DaniWeb® LLC