If you were to upgrade to MooTools 1.4.1 this is what your JS would look like, 
and it does work as expected:
http://jsfiddle.net/zFq2C/5/


On 2011-Oct-22, at 12:42 PM, Michael wrote:

> I think you're getting confused about the difference between the following. 
> An example of each is provided beside each:
> border: 1px solid #ccc;
> border-color: #ccc;
> border-width: 1px;
> border-style: solid;
> 
> You are passing in invalid values that can't be parsed. Or passing in 
> multi-value styles like border, instead of a single value style like 
> border-color.
> 
> This works for me, with the exception of the very first hover, in which the 
> colour jumps to black after the transition is done. It appears there is an 
> issue reading the original CSS value. I also tried separating the colour 
> styles in the style sheet, but that didn't help either.
> http://jsfiddle.net/zFq2C/2/
> 
> But setting the original border colour with JavaScript seems to fix the issue:
> http://jsfiddle.net/zFq2C/3/
> 
> I would however recommend upgrading to the newest version of MooTools as 
> there are a number of fixes and improvements both with Fx, and browser 
> compatibility. In newer versions of MooTools you will probably be best off 
> using Fx.Morph: http://mootools.net/docs/core/Fx/Fx.Morph
> 
> Enjoy!
> 
> 
> 
> On 2011-Oct-22, at 1:37 AM, swen wrote:
> 
>> This is driving me mad , I have a code that works perfect with FX.
>> Morph in 1.2.x all values also work in 1.1 but the border-color or
>> border simply do not work and trow NaNpx error.
>> 
>>       var fx = new Fx.Styles(element,{ duration:500,wait:false });
>>           element.addEvents({
>>               'mouseenter': function() { fx.start({
>>               'background-color':'#ff8c00',
>>               'border-color':'1px solid #cccccc'
>>           });
>> 
>> I checked and getStyle('border') in moo 1.1 returns 1px solid #fffff
>> but border-color returns 4x #ffffff for each border I guess , so how
>> should I declare this properly , each border , border-width , border-
>> style , I have tried all the above and all of them trow error. Most
>> cases NaNpx
>> 
>> Here is JSfiddle http://jsfiddle.net/zFq2C/1/
>> 
>> when you switch from 1.1.2 to 1.2.5 change Styles to Morph
>> 
>> As soon as I use the border IE7 does not work at all , background
>> color works fine . I am sorry but I have to support multiple browsers
>> and multiple moo versions
>> 
>> If you know better solution which would be simply transition another
>> div class in and keep same visual effect please please advise. Thank
>> you!!
>> PS: toggle class is no go on Moo 1.1.2 so I had to do this
> 

Reply via email to