0 Replies Latest reply on Apr 4, 2014 2:22 PM by TAEgner

    Responsive Scaling and Iframes - Cursor misalignment

    TAEgner

      Hello,

       

      related thread in which the problem is identified but not solved: http://forums.adobe.com/message/6182652#6182652

       

      I make use of an iframe to embed a youtube video in my project, but when I enable responsive scaling my mouse position registers incorrectly within the iframe. The effect seems to worsen the further the mouse gets from the anchor point of the iframe. When I disable responsive scaling the problem goes away. I saw a piece of code on another discussion that was used to solve a similar problem with regards to responsive scaling and the jQueryUI .draggable() effect, and I am trying to modify it to work for the iframe. The problem is, I don't understand the code well enough to wrap my brain around it. It is as follows (credit to user "cyclux" for the code):

       

      Responsive Scaling Cursor Pos Correction

      sym.xycompensation = function() {

      var stage = sym.$('Stage');

      var parent = sym.$('Stage').parent();

      var parentWidth = stage.parent().width();

      var stageWidth = stage.width();

      sym.scaleratio = stageWidth/parentWidth;

      };

       

      sym.xycompensation();

       

      $(window).on('resize', function(){

      sym.xycompensation();

      });

       

      sym.infolabel = function(){

      var position = sym.$("box").show();

      var position2 = sym.$("text").show();

        position.css({

          top:sym.posY, left:sym.posX

        });

          position2.css({

          top:sym.posY, left:sym.posX

        });

      };

       

      // Stage.mousemove

       

      sym.posX = e.pageX * sym.scaleratio + 30;

      sym.posY = e.pageY * sym.scaleratio;

       

      sym.infolabel();

      Can anyone see how I might modify this block of code to make it work within an iframe appended to a div called "Featured"?