By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,299 Members | 1,415 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,299 IT Pros & Developers. It's quick & easy.

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

P: n/a
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.
Aug 22 '05 #1
Share this Question
Share on Google+
5 Replies


P: n/a
"Martin" <ma**********@comcast.net> 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>

Aug 22 '05 #2

P: n/a
Ivo
"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?famil...om/handtool.js >

hth
Ivo

Aug 22 '05 #3

P: n/a

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
Aug 22 '05 #4

P: n/a
On Mon, 22 Aug 2005 08:36:48 -0500, "Robi" <me@privacy.net> 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


Aug 22 '05 #5

P: n/a
Herc -

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

Thanks
On Mon, 22 Aug 2005 15:07:12 +1000, "|-|erc" <h@r.c> wrote:
"Martin" <ma**********@comcast.net> 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>


Aug 22 '05 #6

This discussion thread is closed

Replies have been disabled for this discussion.