Click & drag a too-big page around in the browser window?

Discussion in 'Javascript' started by Martin, Aug 22, 2005.

  1. Martin

    Martin Guest

    I have some pages I'm serving out that are about twice the size of the
    browser window (IE only; intranet only). The user must use the
    horizontal and vertical scroll bars to move the page around.

    Is it possible to have a javascript that would allow the user to click
    and drag the page around (kind of like the new Google maps)? I already
    have a ton of scripting in these pages - a few more lines won't hurt
    anything.

    Maybe someone could give me an idea of what such a script might look
    like?

    Thanks.
     
    Martin, Aug 22, 2005
    #1
    1. Advertising

  2. Martin

    |-|erc Guest

    "Martin" <> wrote in ...
    > I have some pages I'm serving out that are about twice the size of the
    > browser window (IE only; intranet only). The user must use the
    > horizontal and vertical scroll bars to move the page around.
    >
    > Is it possible to have a javascript that would allow the user to click
    > and drag the page around (kind of like the new Google maps)? I already
    > have a ton of scripting in these pages - a few more lines won't hurt
    > anything.
    >
    > Maybe someone could give me an idea of what such a script might look
    > like?
    >
    > Thanks.


    this works ok, needs the pointer to change to a hand for the proper effect.

    Herc


    <body onMousemove="microsoftMouseMove()">

    <script>
    mousex = 0
    mousey = 0

    function microsoftMouseMove() {
    oldx = mousex
    oldy = mousey
    mousex = window.event.x
    mousey = window.event.y
    if (window.event.button == 1) {
    document.body.scrollLeft = document.body.scrollLeft - mousex + oldx
    document.body.scrollTop = document.body.scrollTop - mousey + oldy
    }
    window.event.returnValue = false
    }


    </script>

    <img src="test.gif" width=500><br>
    <img src="test.gif" width=500>

    </body>
     
    |-|erc, Aug 22, 2005
    #2
    1. Advertising

  3. Martin

    Ivo Guest

    "Martin" wrote
    > I have some pages I'm serving out that are about twice the size of the
    > browser window (IE only; intranet only). The user must use the
    > horizontal and vertical scroll bars to move the page around.
    >
    > Is it possible to have a javascript that would allow the user to click
    > and drag the page around (kind of like the new Google maps)? I already
    > have a ton of scripting in these pages - a few more lines won't hurt
    > anything.


    Do you mean something like this:
    < http://www.vansandick.com/familie/stamboom/slides.htm >

    If so, then have a look at its script file here:
    < http://www.vansandick.com/familie/stamboom/handtool.js >

    or with some Javascript syntax highlighting:
    < http://www.vansandick.com/view?familie/stamboom/handtool.js >

    hth
    Ivo
     
    Ivo, Aug 22, 2005
    #3
  4. Martin

    Robi Guest

    Ivo wrote:
    > "Martin" wrote
    >>
    >> I have some pages I'm serving out that are about twice the size of the
    >> browser window (IE only; intranet only). The user must use the
    >> horizontal and vertical scroll bars to move the page around.


    why would you restrict people to use IE???

    >> Is it possible to have a javascript that would allow the user to click
    >> and drag the page around (kind of like the new Google maps)? I already
    >> have a ton of scripting in these pages - a few more lines won't hurt
    >> anything.


    that would be "panning"?

    If you have a wheel mouse where the wheel acts as third (middle) button,
    you can use that (I mean, you're restricting your users anyway, while
    this wouldn't restrict the users though ;-)

    > Do you mean something like this:
    > < http://www.vansandick.com/familie/stamboom/slides.htm >


    I don't know if it's unintentional, but besides the tree branches not
    being aligned, if there is a "pan" function it ain't working on my
    IE6 version.

    > If so, then have a look at its script file here:
    > < http://www.vansandick.com/familie/stamboom/handtool.js >


    function cbWindow(){
    this.fail=1;
    var n=window.navigator,an=n.appName.toLowerCase(),ag=n.userAgent.toLowerCase();
    if(ag.indexOf("win")<0 || ag.indexOf("opera")>=0)
    return;
    var k=0,v_ie=0,v_nn=0;
    if((k=ag.indexOf("msie"))>=0) v_ie=parseFloat(ag.substring(k+5));
    else if(an.indexOf("netscape")>=0) v_nn=parseFloat(n.appVersion);
    _ie=_nn=_mz=0;
    if(v_ie>=4)_ie=1;
    else if(v_nn>=5) _mz=1;
    else if(v_nn>=4) _nn=1;
    else return;
    this.fail=0;
    appName???? opera? win? netscape? aren't there any other browsers?
    can't appName be spoofed?

    oh, and on <http://www.vansandick.com/familie/stamboom/tijdbalk.htm>

    if (navigator.appName != "Microsoft Internet Explorer")document.write("Sorry, the browser you are using may not understand the
    script on this page.\nTry accessing this page in Internet Explorer.")

    is somewhat restricting 8-o
     
    Robi, Aug 22, 2005
    #4
  5. Martin

    Martin Guest

    On Mon, 22 Aug 2005 08:36:48 -0500, "Robi" <> wrote:

    >
    >Ivo wrote:
    >> "Martin" wrote
    >>>
    >>> I have some pages I'm serving out that are about twice the size of the
    >>> browser window (IE only; intranet only). The user must use the
    >>> horizontal and vertical scroll bars to move the page around.

    >
    >why would you restrict people to use IE???


    Because the pages in question use VML to display a lot of graphic
    items. And VML works only in IE. And, as I noted, these pages are
    displayed only on an intranet (of a single company). And, such useage
    is limited to about 4-5 people - all of whom use IE.

    A question for you: why do you need an explanation of my situation (of
    which you know nothing about)? I was looking for a technical answer to
    a technical question.

    >>> Is it possible to have a javascript that would allow the user to click
    >>> and drag the page around (kind of like the new Google maps)? I already
    >>> have a ton of scripting in these pages - a few more lines won't hurt
    >>> anything.

    >
    >that would be "panning"?


    Thanks you for the definition. I will be sure to use it the next time.

    >If you have a wheel mouse where the wheel acts as third (middle) button,
    >you can use that (I mean, you're restricting your users anyway, while
    >this wouldn't restrict the users though ;-)


    I believe the wheel mouse is capable of "panning" only in a vertical
    direction. This wouldn't help in "panning" the page sideways.

    >> Do you mean something like this:
    >> < http://www.vansandick.com/familie/stamboom/slides.htm >

    >
    >I don't know if it's unintentional, but besides the tree branches not
    >being aligned, if there is a "pan" function it ain't working on my
    >IE6 version.


    It works OK in my IE6.

    >> If so, then have a look at its script file here:
    >> < http://www.vansandick.com/familie/stamboom/handtool.js >

    >
    >function cbWindow(){
    > this.fail=1;
    > var n=window.navigator,an=n.appName.toLowerCase(),ag=n.userAgent.toLowerCase();
    > if(ag.indexOf("win")<0 || ag.indexOf("opera")>=0)
    > return;
    > var k=0,v_ie=0,v_nn=0;
    > if((k=ag.indexOf("msie"))>=0) v_ie=parseFloat(ag.substring(k+5));
    > else if(an.indexOf("netscape")>=0) v_nn=parseFloat(n.appVersion);
    > _ie=_nn=_mz=0;
    > if(v_ie>=4)_ie=1;
    > else if(v_nn>=5) _mz=1;
    > else if(v_nn>=4) _nn=1;
    > else return;
    > this.fail=0;
    >appName???? opera? win? netscape? aren't there any other browsers?
    >can't appName be spoofed?
    >
    >oh, and on <http://www.vansandick.com/familie/stamboom/tijdbalk.htm>
    >
    >if (navigator.appName != "Microsoft Internet Explorer")document.write("Sorry, the browser you are using may not understand the
    >script on this page.\nTry accessing this page in Internet Explorer.")
    >
    >is somewhat restricting 8-o
    >
     
    Martin, Aug 22, 2005
    #5
  6. Martin

    Martin Guest

    Herc -

    I used your script (slightly modified). Does just what I want.

    Thanks


    On Mon, 22 Aug 2005 15:07:12 +1000, "|-|erc" <> wrote:

    >"Martin" <> wrote in ...
    >> I have some pages I'm serving out that are about twice the size of the
    >> browser window (IE only; intranet only). The user must use the
    >> horizontal and vertical scroll bars to move the page around.
    >>
    >> Is it possible to have a javascript that would allow the user to click
    >> and drag the page around (kind of like the new Google maps)? I already
    >> have a ton of scripting in these pages - a few more lines won't hurt
    >> anything.
    >>
    >> Maybe someone could give me an idea of what such a script might look
    >> like?
    >>
    >> Thanks.

    >
    >this works ok, needs the pointer to change to a hand for the proper effect.
    >
    >Herc
    >
    >
    ><body onMousemove="microsoftMouseMove()">
    >
    ><script>
    >mousex = 0
    >mousey = 0
    >
    >function microsoftMouseMove() {
    > oldx = mousex
    > oldy = mousey
    > mousex = window.event.x
    > mousey = window.event.y
    > if (window.event.button == 1) {
    > document.body.scrollLeft = document.body.scrollLeft - mousex + oldx
    > document.body.scrollTop = document.body.scrollTop - mousey + oldy
    > }
    > window.event.returnValue = false
    >}
    >
    >
    ></script>
    >
    ><img src="test.gif" width=500><br>
    ><img src="test.gif" width=500>
    >
    ></body>
    >
    >
     
    Martin, Aug 22, 2005
    #6
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Martin
    Replies:
    0
    Views:
    476
    Martin
    Aug 4, 2004
  2. Shaguf
    Replies:
    0
    Views:
    363
    Shaguf
    Dec 24, 2008
  3. Shaguf
    Replies:
    0
    Views:
    458
    Shaguf
    Dec 26, 2008
  4. Shaguf
    Replies:
    0
    Views:
    244
    Shaguf
    Dec 26, 2008
  5. Shaguf
    Replies:
    0
    Views:
    219
    Shaguf
    Dec 24, 2008
Loading...

Share This Page