0

I have a div in my html code with this style:

-webkit-transform: translate(-360px, -360px) scale(1) translate(960px, 238.5px) translate(0px, 0px) scale(1);

the last value of scale goes from 1 to 2, and it is the zoom that I do with the scroll on the div.

I need to create in Javascript a conditional rule, in the situation that the scale is over 1.5, but how can I do it?

The other values could change, so I cannot rewrite the entire string...

something like:

var test = getElementById('div').style.webkitTransform.scale
if (test > 1.5) { };
MaxArt
  • 22,200
  • 10
  • 82
  • 81

1 Answers1

0

You can cut short with a simple regular expression:

var xform = document.getElementById('div').style.webkitTransform,
    match = xform.match(/scale\(([\-\d\.]+)\)$/);
if (m && m[1] > 1.5) {
    // ...
}

Of course you have to be sure that the transform property is in that exact format, but the conditional expression checks for it.

MaxArt
  • 22,200
  • 10
  • 82
  • 81
  • thank you for your answer! But doesn't work.. Maybe because the div in question isn't created in the same file – user2112273 Jan 16 '14 at 13:56
  • @user2112273 "It doesn't work" isn't a reply. What doesn't work? What does `xform` yield? BTW, I just noticed, while copying & pasting your code, that you wrote `getElementById` without `document`. Maybe that's the problem? – MaxArt Jan 16 '14 at 16:26
  • I'm trying to let you understand. I'm not very able with codes.. This is an example page: http://www.areavisuale.it/scarpa.html Here, if you check the code, you can see an IMG id called objectimage2. That img have a webkit-transfor, and a scale that changes when I zoom. I would like to retrieve that value, so that when the zoom is > 1.5 a button appears. I've tried with your code, but nothing happens. I thought that the problem was that 'objectimage2' is created automatically by a "idontknowwhich" code, hence is not inside my html or js. – user2112273 Jan 16 '14 at 17:35
  • @user2112273 Purtroppo non possiamo parlare italiano, qui XD Anyway, the code works, but maybe you're right and you're doing it at the wrong time. You should quote more of your code. – MaxArt Jan 16 '14 at 21:37
  • I tried to insert the code in the html file, and in 2 js files that I have, but the console returnes or that 'm' is undefined or that can't read 'style' of null. 'objectimage2' is the id of an IMG inside a div named viewport, I found only this last one in the js code; so probably 'objectimage2' is automatically created, and I can't read it. – user2112273 Jan 17 '14 at 09:55