#821 can't setStyles() using getStyles("border") - mootools.core

Type	To find
responsible:me	tickets assigned to you
tagged:"@high"	tickets tagged @high
milestone:next	tickets in the upcoming milestone
state:invalid	tickets with the state invalid
created:"last week"	tickets created last week
sort:number, importance, updated	tickets sorted by #, importance or updated
Combine keywords for powerful searching.
Use advanced searching »

This project is archived and is in readonly mode.

#821 ✓wontfix

can't setStyles() using getStyles("border")

Reported by batman42ca | January 3rd, 2010 @ 02:03 AM | in 2.0 (closed)

The following attempt to read the border from one DIV using getStyles() and then using setStyles() to set the border for another DIV fails I suspect, because getStyles("border"); returns:

"1px solid #000000 1px solid #000000 1px solid #000000 1px solid #000000"

using Mootools 1.2.4, Firefox 3.5.3 or IE6:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<HTML>
<HEAD>

<style type="text/css">
  #one { border : 1px solid #000;}
</style>

<script type="text/javascript">
  window.addEvent("domready",function() {
    var styles = $("one").getStyles("border");
    $("two").setStyles(styles);
  });

</HEAD>

<BODY>
<div id="one">one</div>
<div id="two">two</div>
</BODY>

</HTML>

Comments and changes to this ticket

Sebastian Markbåge January 5th, 2010 @ 12:42 PM
The obvious solution is to be more explicit such as getStyles("border-left", "border-right", "border-top", "border-bottom") or getStyles("border-left-width", "border-left-color", ...)

But that doesn't address the issue that it seems very intuitive to be able to read back any property you can set.

Reading back CSS is actually a pretty complex thing. Reading back anything that's set using a composite is always difficult. The CSSOM standard is actually very incomplete in this area and nobody is really working on improving it.

Now we could provide built-in support for any given CSS property. But is it worth while downloading and maintaining that additional code as opposed to the user being a bit more explicit? That's still up for debate.
fakedarren February 8th, 2010 @ 01:46 PM
- State changed from “new” to “open”
- Assigned user set to “Valerio”
One for the boss to decide....
You flagged this item as spam.
G` August 2nd, 2011 @ 04:20 PM
Better practice would be to use CSS classes and not set styles with JS.
You flagged this item as spam.
batman42ca August 10th, 2011 @ 02:09 PM
G`

Notice that I'm not just setting the styles, I'm reading the style from one element and applying it to another.

Using CSS classes as you suggest, in response to a user's action, how would I read the style from one element and apply it to another?
ibolmo January 19th, 2012 @ 09:49 AM
- State changed from “open” to “wontfix”
I'm putting this as a wontfix, only because it is a difficult problem. If you're interested, in us having another look please create a Github Issue at: http://github.com/mootools/mootools-core/issues.