mercredi 31 décembre 2014

simple jquery calculation

i have a site that has a "container" div that is 200% of the browser window width, and the overflow is hidden. some information is on the left half of the container (the first 100%), and some information is on the right half (the second 100%). i use a simple icon toggle to slide back and forth between both halves of the container, like so:


$('.container').animate({'marginLeft':'-=100%'}, 'slow');


-- or --


$('.container').animate({'marginLeft':'+=100%'}, 'slow');


the issue is, i need to perform certain events based on the marginLeft of the container.


when the first half is visible, i have no problems with getting the events i want. but when jquery slides the container to the left by 100%, making the second half visible, i cannot get anything to work.


after many many hours of research i have learned that i CANNOT use


if ($('.container').css('marginLeft') == '-100%') { //do something here


because the alert never tells me the marginLeft as a percentage, it always returns the number in exact pixels.


my conclusion is that i need a simple calculation in my "if" statement, but i have no idea how to write one.


in written english it would be:


"if the marginLeft in pixels divided by the window width in pixels is equal to -1 then please do stuff..."


can someone please walk me through how to create this very rudimentary jquery calculation and apply it to an if-statement?


any assistance would be greatly greatly appreciated.


many thanks and happy new year, David.


Aucun commentaire:

Enregistrer un commentaire