Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Loading…

Fixes #2160. #2263

Merged
merged 2 commits into from

2 participants

@ibolmo
Owner

Using @ryanmorr's fix for non px starting values. This fix is primarily
for FFx, but it's not very easy to feature detect this Firefox bug. Open
to suggestions.

For now, this works quite well and also covers em, and other units.

This doesn't work for getStyle since we require an ending value, and
besides we wouldn't want to do this across all units.

PASSES: IE6-9; Firefox 3-5, 8, 10; Opera 11; Chrome latest; Safari 5

ibolmo added some commits
@ibolmo ibolmo Fixes #2160.
Adds coverage for Fx.Morph unit: %.
25a996a
@ibolmo ibolmo Fixes #2160.
Using @ryanmorr's fix for non px starting values. This fix is primarily
for FFx, but it's not very easy to feature detect this Firefox bug. Open
to suggestions.

For now, this works quite well and also covers em, and other units.

This doesn't work for getStyle since we require an ending value, and
besides we wouldn't want to do this across all units.

PASSES: IE6-9; Firefox 3-5, 8, 10; Opera 11; Chrome latest; Safari 5
955eb53
@arian
Owner

This seems to work :D

@ibolmo ibolmo merged commit 7c26dd3 into mootools:master
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Commits on Jan 29, 2012
  1. @ibolmo

    Fixes #2160.

    ibolmo authored
    Adds coverage for Fx.Morph unit: %.
Commits on Jan 30, 2012
  1. @ibolmo

    Fixes #2160.

    ibolmo authored
    Using @ryanmorr's fix for non px starting values. This fix is primarily
    for FFx, but it's not very easy to feature detect this Firefox bug. Open
    to suggestions.
    
    For now, this works quite well and also covers em, and other units.
    
    This doesn't work for getStyle since we require an ending value, and
    besides we wouldn't want to do this across all units.
    
    PASSES: IE6-9; Firefox 3-5, 8, 10; Opera 11; Chrome latest; Safari 5
This page is out of date. Refresh to see the latest.
View
6 Source/Fx/Fx.CSS.js
@@ -25,6 +25,12 @@ Fx.CSS = new Class({
if (values[1] == null){
values[1] = values[0];
values[0] = element.getStyle(property);
+ // adapted from: https://github.com/ryanmorr/fx/blob/master/fx.js#L299
+ if (this.options.unit != 'px'){
+ element.setStyle(property, values[1] + this.options.unit);
+ values[0] = (values[1] || 1) / parseFloat(element.getComputedStyle(property)) * (parseFloat(values[0]) || 0);
+ element.setStyle(property, values[0] + this.options.unit);
+ }
}
var parsed = values.map(this.parse);
return {from: parsed[0], to: parsed[1]};
View
41 Specs/1.4client/Fx/Fx.Morph.js
@@ -0,0 +1,41 @@
+
+describe('Fx.Morph', function(){
+
+ beforeEach(function(){
+ this.clock = sinon.useFakeTimers();
+
+ this.div = new Element('div', {'class': 'pos-abs-left'});
+ this.style = new Element('style');
+ var definition = [
+ '.pos-abs-left {',
+ 'position: absolute;',
+ 'width: 200px;',
+ 'height: 200px;',
+ 'left: 10%;',
+ 'background: red',
+ '}'
+ ].join('');
+
+ [this.style, this.div].invoke('inject', document.body);
+
+ if (this.style.styleSheet) this.style.styleSheet.cssText = definition;
+ else this.style.set('text', definition);
+ });
+
+ afterEach(function(){
+ this.clock.reset();
+ this.clock.restore();
+ [this.div, this.style].invoke('destroy');
+ });
+
+ it('should morph between % units', function(){
+ var spy = spyOn(this.div, 'setStyle').andCallThrough();
+ this.div.set('morph', {unit : '%'}).morph({'left': 50});
+
+ this.clock.tick(1000);
+
+ expect(this.div.setStyle).toHaveBeenCalledWith('left', ['10%']);
+ expect(this.div.setStyle).toHaveBeenCalledWith('left', ['50%']);
+ });
+
+});
View
3  Specs/Configuration.js
@@ -110,7 +110,8 @@ Configuration.sets = {
'Element/Element',
'Element/Element.Event',
'Element/Element.Delegation',
- 'Fx/Fx.Tween'
+ 'Fx/Fx.Tween',
+ 'Fx/Fx.Morph'
]
},
Something went wrong with that request. Please try again.