Additional controls for Interactive Image Panning

Hey I’m a graphic design student and I’ve found your post on interactive image panning quite useful. I was wondering if you could help me with the coding of my current project. I’m trying to create a website that you could pan and has different hotspots or buttons you can access. So when you’re panning the site and find a hotspot, the cursor will situate itself on the hotspot for a few seconds and allow you to click or access it.

I’ve already used your AS3 coding for panning but need the correct values to keep the buttons situated and make the panning more friendly. I don’t know AS3 coding at all so I’m just spittballing here. Here’s what I have so far. Ps. Haven’t connected the buttons yet.

import flash.display.;
import flash.events.
;

constrainedMove(page, 2, 1);

function constrainedMove(target:MovieClip, speed:Number, dir:int){
var mousePercent:Number = mouseX / stage.stageWidth;

stage.addEventListener(MouseEvent.MOUSE_MOVE, panImage);
target.cacheAsBitmap = true;

function panImage(E:MouseEvent):void {
    var mSpeed:Number;
    mousePercent = mouseX / stage.stageWidth;
    if (dir == 1) {
        mSpeed = 1 - mousePercent;
    } else {
        mSpeed = mousePercent;
    }
    target.destX = Math.round(-((target.width - stage.stageWidth) * mSpeed));
    if(target.hasEventListener(Event.ENTER_FRAME)){
        target.removeEventListener(Event.ENTER_FRAME, del);
    }
    target.addEventListener(Event.ENTER_FRAME, del);
    E.updateAfterEvent();
}

function del(E:Event):void {
    if (Math.abs(target.x - target.destX) <= 1) {
        target.x = Math.round(target.destX);
        target.removeEventListener(Event.ENTER_FRAME, arguments.callee);
    } else {
        target.x += (target.destX - target.x) * (speed / 100);
    }
}

}
import flash.display.;
import flash.events.
;

constrainedMove1(page, 2, 1);

function constrainedMove1(target:MovieClip, speed:Number, dir:int){
var mousePercent:Number = mouseY / stage.stageHeight;

stage.addEventListener(MouseEvent.MOUSE_MOVE, panImage);
target.cacheAsBitmap = true;

function panImage(E:MouseEvent):void {
    var mSpeed:Number;
    mousePercent = mouseY / stage.stageHeight;
    if (dir == 1) {
        mSpeed = 1 - mousePercent;
    } else {
        mSpeed = mousePercent;
    }
    target.destY = Math.round(-((target.width - stage.stageHeight) * mSpeed));
    if(target.hasEventListener(Event.ENTER_FRAME)){
        target.removeEventListener(Event.ENTER_FRAME, del);
    }
    target.addEventListener(Event.ENTER_FRAME, del);
    E.updateAfterEvent();
}

function del(E:Event):void {
    if (Math.abs(target.y - target.destY) <= 1) {
        target.y = Math.round(target.destY);
        target.removeEventListener(Event.ENTER_FRAME, arguments.callee);
    } else {
        target.y += (target.destY - target.y) * (speed / 50);
    }
}

}