473,581 Members | 2,694 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Opera 6 & 7 scrolling.

I'm working (playing) on a mouse following script. Yes, the sort no
one likes but I'm having great fun tinkering with it - sad.

Anyway, if there's enough page content to cause scrolling and I want
the objects (colored divs) to scroll with the mouse in Opera 6. I give
the mouse y coords (-) window.pageYOff set and the objects (+)
window.pageYOff set.

However, in Opera 7 it doesn't work. Only the following objects need
(+) window.pageYOff set. The mouse code doesn't need anything and it
works as I want?

Therefor, if there isn't a better scroll method?, I need an Opera 6/7
detection. I know that object detection is prefered over browser
detection but I don't of any differences to reference between 6 and 7.

Pete.
Jul 20 '05 #1
7 1957
Pete wrote:
Therefor, if there isn't a better scroll method?, I need an Opera 6/7
detection. I know that object detection is prefered over browser
detection but I don't of any differences to reference between 6 and 7.


Look at the userAgent string. I am sure that Opera 6 doesn't contain
Opera 7.23 in it (which is what my Opera 7 has in it). No matter which
spoof mode I had it in, it contained that snippet.

As well, I am sure there has to be some feature difference between them,
other than the userAgent string.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javas cript FAQ - http://jibbering.com/faq/

Jul 20 '05 #2
"Pete" <so************ *******@yahoo.c o.uk> wrote in message
news:1a******** *************** ***@posting.goo gle.com...
<snip>
Anyway, if there's enough page content to cause scrolling and
I want the objects (colored divs) to scroll with the mouse in
Opera 6. I give the mouse y coords (-) window.pageYOff set and
the objects (+) window.pageYOff set.

However, in Opera 7 it doesn't work. Only the following objects
need (+) window.pageYOff set. The mouse code doesn't need anything
and it works as I want?

Therefor, if there isn't a better scroll method?, I need an
Opera 6/7 detection. I know that object detection is prefered
over browser detection but I don't of any differences to
reference between 6 and 7.


The simple positioning of CSS position:absolu te; DIV elements taking
scrolling into account does not need significantly different handling
between Opera 6 and 7 (apart, possibly from the handling of appending
CSS units to the top and left values).

It is much morel likely that your problem is with the differences in the
reporting of mouse co-ordinates between the two. With Opera 6 only
providing clientX and clientY values but reporting those values as if
they were pageX and pageY, While Opera 7 returns genuine client area
co-ordinates for those values and also provides pageX and pageY as
alternatives.

When reading mouse co-ordinates I prefer the pageX and pageY values and
only fall back to clientX and clientY if they are missing, such as on
IE, IceBrowser and Opera 6. But knowing that Opera 6 values do not need
adjusting by the scroll values I use the presence of the window.opera
object as indicating that the clientX/Y values do not need adjusting by
the scroll (and [root].clientTop/Left) values in order to be equivalent
to the page values. That is the nearest that I have come to needing to
do anything resembling browser detecting.

Richard.
Jul 20 '05 #3
Randy Webb <hi************ @aol.com> wrote in message news:<uZ******* *************@c omcast.com>...
Look at the userAgent string. I am sure that Opera 6 doesn't contain
Opera 7.23 in it (which is what my Opera 7 has in it). No matter which
spoof mode I had it in, it contained that snippet.

As well, I am sure there has to be some feature difference between them,
other than the userAgent string.


Yes, I tried that and like you got the required result with all Opera
7.22 spoofs - see code below. However, I don't have versions 5 or 6 to
test with and will it be OK with future versions? Oh well, thanks
anyway. Unless some one comes up with something better I'll use it for
now. Like I said, it's only a bit fun.
Pete.

<script type="text/javascript">
//Main thing------------------------
var ua=navigator.us erAgent;
var op=(ua.indexOf( "Opera") != -1);
var op7;
var oa=0;
var ob=0;
var oc=0;
var ov=0;
if (op){
oa=ua.indexOf(" Opera")+6;
ob=oa+4;
oc=ua.substring (oa,ob);
ov=parseFloat(o c);
}
op7=(op && ov >= 7)?true:false;
//--------------------------------

//Test----------------------------
var a=(op)?"Yes":"N o";
var b=(op)?"Is it version 7 or higher\? ":"";
var c;
if (op && ov >= 7) c="Yes";
else if (op && ov < 7) c="No";
else c="";
var d=(op)?"Its\' version " +ov:"";
alert('Is it Opera\? '+a+'\n'+b+c+'\ n'+d);
//--------------------------------
</script>
Jul 20 '05 #4
"Pete" <so************ *******@yahoo.c o.uk> wrote in message
news:1a******** *************** ***@posting.goo gle.com...
<snip>
Yes, I tried that and like you got the required result with
all Opera 7.22 spoofs - see code below. However, I don't
have versions 5 or 6 to test with and will it be OK with
future versions? Oh well, thanks anyway. Unless some
one comes up with something better I'll use it for now.
Like I said, it's only a bit fun.

<snip>

Being able to tell the difference between two versions of Opera
regardless of their spoofing modes does not solve the problem as you
still cannot tell the difference between Opera and another browser
spoofing Opera. There was a time when I don't think any other browser
would spoof Opera (couldn't see much point) but I was wrong and there
are browsers out there that offer an option to spoof the Opera UA string
in their preferences.

But the script you are describing can be (and has been) implemented in a
cross-browser form without the need to be interested in the UA string at
all. You would probably benefit more in the long run by finding out what
it is you are doing wrong that is provoking you apparent problem and
fixing that than setting off in a direction (UA string testing) that has
already been demonstrated to be worthless.

Richard.
Jul 20 '05 #5
"Richard Cornford" <Ri*****@litote s.demon.co.uk> wrote in message news:<bv******* ************@ne ws.demon.co.uk> ...
The simple positioning of CSS position:absolu te; DIV elements taking
scrolling into account does not need significantly different handling
between Opera 6 and 7 (apart, possibly from the handling of appending
CSS units to the top and left values).
I wouldn't have thought so either but it's what I'm getting. Maybe it
would be better if I include the script. It's stripped down just for
Opera and the pageYOffset thing.

Copy and paste some more <p>'s to cause scrolling then alternate the
pageYOffset's. As is - it works in 7 but not 6 and vice-versa.

<html><head><ti tle>test</title>
<style type="text/css">
#box{
position:absolu te;top:0px;left :0px;
width:20px;heig ht:20px;backgro und:blue;
}
</style>
</head><body>

<div id="box"></div>

<script type="text/javascript">
var y1=x1=y2=x2=y3= x3=0;
var temp=document.g etElementById(" box").style;

function mouse(){
y1 = event.clientY;// - window.pageYOff set;
x1 = event.clientX;
}
document.onmous emove=mouse;

function move_these(){
temp.top = y2 + window.pageYOff set;
temp.left = x2;
}

function delay(){
y2 = y3 += (y1 - y3) * 0.1;
x2 = x3 += (x1 - x3) * 0.1;
move_these();
setTimeout('del ay()',50);
}

window.onload=d elay;
</script>

<p>&nbsp;</p>
<p>&nbsp;</p> more....

</body>
</html>

It is much morel likely that your problem is with the differences in the
reporting of mouse co-ordinates between the two. With Opera 6 only
providing clientX and clientY values but reporting those values as if
they were pageX and pageY, While Opera 7 returns genuine client area
co-ordinates for those values and also provides pageX and pageY as
alternatives.
I didn't know that. Would..
((event.clientY )||(event.pageY &&event.clientY ))
?event.clientY: event.clientY-window.pageYOff set;
...do?
When reading mouse co-ordinates I prefer the pageX and pageY values and
only fall back to clientX and clientY if they are missing, such as on
IE, IceBrowser and Opera 6. But knowing that Opera 6 values do not need
adjusting by the scroll values I use the presence of the window.opera
object as indicating that the clientX/Y values do not need adjusting by
the scroll (and [root].clientTop/Left) values in order to be equivalent
to the page values. That is the nearest that I have come to needing to
do anything resembling browser detecting.

Richard.

Jul 20 '05 #6
"Pete" <so************ *******@yahoo.c o.uk> wrote in message
news:1a******** *************** ***@posting.goo gle.com...
<snip>
I wouldn't have thought so either but it's what I'm
getting. Maybe it would be better if I include the
script.
It almost always is.

<snip>function mouse(){
y1 = event.clientY;// - window.pageYOff set;
x1 = event.clientX;
}
There you go, Opera 6 returns co-ordinates relative to the page for
clientX/Y while Opera 7 (correctly) returns co-ordinates relative to the
client area.
document.onmous emove=mouse;
Netscape 4 (but preferably not later Netscape versions (though they do
support the function)) requires calls to document.captur eEvents if you
want to follow mouse movement at the document level.
function move_these(){
temp.top = y2 + window.pageYOff set;
temp.left = x2;
}
If the mouse co-ordinates you are using are page relative you do not
need to adjust for the scrolling values at this point, if you use client
co-ordinates then you do need to adjust.

But the CSS units value comes in at this point. On standards compliant
browsers a string value should be assigned to the top and left style
properties with appended units. OTOH older browsers prefer the values to
be provided as numbers. My strategy for dealing with this problem is
based on using typeof to test one of style.top or style.left to see if
it is of string type or numeric. If it is a string then it is best to
provide CSS units, if it is a number then it is best to assign a number.
I do this by assigning a value to a suitably scoped variable based on
the typeof test:-

var posMod = (typeof temp.top == 'string')?'px': 0;

-and then when a value is to be assigned to top or left (or any other
style value that need similar handling) I use the + operator:-

temp.top = y2 + posMod;

- the - y2 - value is a number and - posMod - is either the number zero
or it is the string 'px' so the action of the + operator depends on the
type of posMod. If - posMod - is zero then - + - does addition and
adding zero to a number results in an unchanged number, and that is
assigned to the style property. But if - posMod - is the string 'px'
the - + - operator does string concatenation, type-converting the - y2 -
value to a string and then appending 'px' to it, providing the desired
string value with the CSS units.
function delay(){
y2 = y3 += (y1 - y3) * 0.1;
x2 = x3 += (x1 - x3) * 0.1;
move_these();
setTimeout('del ay()',50);
}
If - delay - always calls - delay - (without the option of being
cancelled) it would be wroth looking into the setInterval function as an
alternative.

<snip> I didn't know that. Would..
((event.clientY )||(event.pageY &&event.clientY ))
?event.clientY: event.clientY-window.pageYOff set;
..do?


Over the years I have tried out various strategies for reading the mouse
co-ordinates, the following is the latest version of my cross browser
document.onmous emove following object:-

var MoveFollow = (function(){
var global = this;
var theOne = {
getPageX:functi on(){
return ((readScroll.sc rollLeft|0) -
(readScroll.cli entLeft|0) + XY.x);
},
getPageY:functi on(){
return ((readScroll.sc rollTop|0) -
(readScroll.cli entTop|0) + XY.y);
},
getPageXY:funct ion(){
return {x:this.getPage X(),y:this.getP ageY()};
},
upDate:function (ev){
mm(ev);
}
};
var XY = {x:0,y:0};
var readScroll = {scrollTop:0,sc rollLeft:0,
clientLeft:0,cl ientTop:0};
var eventInited = false;
var posReadX = 'pageX';
var posReadY = 'pageY';
function mm(e){
e = e||global.event ;
XY.x = e[posReadX];
XY.y = e[posReadY];
};
function initEvent(ev){
ev = ev||global.even t;
if(ev){
if(typeof ev.pageX != 'number'){ //Opera 7 has pageX
posReadX = 'clientX';
posReadY = 'clientY';
if(!global.oper a){ //Not an Opera browser
if((typeof document.compat Mode == 'string')&&
(document.compa tMode.indexOf(' CSS') != -1)&&
(document.docum entElement)){
readScroll = document.docume ntElement;
}else if(document.bod y){
readScroll = document.body;
}
}
}
setUpOnMouse(mm );
mm(ev);
eventInited = true;
}else{
setUpOnMouse(in itEvent);
}
};
function setUpOnMouse(f) {
if(document.onm ousemove != f){
document.onmous emove = f;
if((document.ca ptureEvents)&&( global.Event)&&
(document.layer s)&&(typeof Layer == 'function')){
document.captur eEvents(Event.M OUSEMOVE);
}
}
};
initEvent();
return (function(){
return theOne;
});
})(); //simultaneously define and call (one-off)!

The - MoveFollow - global variable is assigned a function and once it
has been assigned any other code can call the - MoveFollow - function,
which will return a reference to an object that represents a common
interface to the onmousemove events (cross-browser). The bulk of the
testing and configuration work is done as this script initialises itself
so once it is running it is very efficient.

The reference to the interface is acquired as:-

var mouseMoveFollow er = MoveFollow();

-the the latest mouse X and Y co-ordinates (relative to the HTML page)
are retrieved using the interface's getPageX/Y methods:-

var pageXcord = mouseMoveFollow er.getPageX();
/* and */
var pageYcord = mouseMoveFollow er.getPageY();

If you can understand the code (with its inline function expression
call, nested functions, and so on) you should be able to understand how
the code decides which values to read from the event objects. It is the
only code that I use that has any interest in which browser is on use
specifically in order to cope with the incorrect reporting of clientX/Y
in Opera 6. Which is done by checking Opera's global - opera - property.
That isn't a problem for Opera 7, which has the pageX/Y properties on
the event object and the code prefers to use those if available.

Richard.
Jul 20 '05 #7
Richard Cornford:

Thanks for the script and the obvious effort put in to it, you
certainly know your onions. Also, thanks for introducing me to the
"typeof". Had loads of fun with that and very handy. I see what you
mean about pageY vs. clientY in Opera 7. pageY/X definitely from now
on. This eliminated my original 6/7 problem.

I do know about the document.captur eEvents etc for Netscape 4 but
deliberately didn't write for it. It would be nice to write for older
browsers but I think you have to draw the line somewhere. Nothing of
importance depends on my efforts so I'm just going to concentrate on
the present, future and, hopefully, standards.

Anyway, although yours is excellent, I never feel right if I haven't
put the effort in and written something myself so here's my 'lesser'
effort. I managed to fix up my old PC with 6 and the script works OK
and on the new one with Explorer 6, Netscape 7.1 and Opera 7.22 with
various and no doctypes.

One thing I didn't understand was your setInterval over setTimeout but
I'll look that up my self.
Thanks again,
Pete.
Doctype just for show.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Modern </title>
<style type="text/css">
#box{
position:absolu te;top:0px;left :0px;
width:20px;heig ht:20px;backgro und:blue;
}
</style>
</head>
<body>

<div id="box"></div>

<script type="text/javascript">
<!--
if (document.getEl ementById){

var y1=x1=y2=x2=y3= x3=0;
var temp=document.g etElementById(" box").style;

function mouse(e){
var msy = (typeof window.pageYOff set ==
'number')?windo w.pageYOffset:0 ;
if (!e) e = window.event;
if (typeof e.pageY == 'number'){
y1 = e.pageY - msy;
x1 = e.pageX;
}
else{
y1 = e.clientY - msy;
x1 = e.clientX;
}
}
document.onmous emove=mouse;

function apply_to_these( ){
var osy = (typeof window.pageYOff set == 'number')
?window.pageYOf fset:(document. compatMode && document.compat Mode ==
'CSS1Compat')?
document.docume ntElement.scrol lTop:document.b ody.scrollTop;

//Above might have a wrap problem when posted.

temp.top = y2 + osy + "px";
temp.left = x2 + "px";
}

function delay(){
y2 = y3 += (y1 - y3) * 0.1;
x2 = x3 += (x1 - x3) * 0.1;
apply_to_these( );
setTimeout('del ay()',50);//Will investigate this.
}
window.onload=d elay;

}
//-->
</script>

<p>&nbsp;</p><p>&nbsp;</p>
Lots more....

</body>
</html>
Jul 20 '05 #8

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

4
1291
by: Koyan | last post by:
Hallo everbody, I am using the following function: function MultimediaOpenWnd (ids,action1,captions,wd,ht) { var features = "width=" + wd + ",height=" + ht + "scrollbars=yes,menubar=no"; window.open("/international_en/multimedia/image-popup?id=" + ids + "&amp;actionval=" +action1+ "&amp;caption="+captions+"", "ImagePopUp",features)
1
2621
by: Mark Tranchant | last post by:
Argh. I've no idea where to start with this one. Take a look at: http://tranchant.plus.com/notes/cable-wrap The problem occurs on all pages, but you need a fairly long page to demonstrate it. I've recently added dynamically-generated next/prev/up/start links, and a few "common" links to the header bar. Works fine in Firefox (fixed...
1
2649
by: Bob Richardson | last post by:
I'm in the process of changing from a framed to non-framed web. My test site is: http://www.writeonwhidbey.org/_private/ssi/ssitestBOB.html The scrolling navbar, that stays fixed at the top of the page when you scroll down, works for all browsers that I've tried except Opera. (I'm using Opera 7.54). This nav bar is included in every file...
5
4549
by: bwucke | last post by:
Is there any way to scroll textarea (to the bottom row) from Javascript in Opera? The textarea.scrollTop=textarea.scrollHeight+textarea.scrollTop; approach doesn't work, and there's so many notices that it doesn't all over the net, that if there's any solution/workaround to this problem on the net, it's unfindable. Alternatively (my...
11
4975
by: Rioshin an'Harthen | last post by:
In designing a new site for the local bridge club, I've stumbled upon a problem with my css code. Interesting fact is that I copied the code from another website an aquaintance did a few years back, and on that page it displays correctly. The front page stuff, for some strange reason I can't fathom, doesn't display in the div-element I have...
1
1611
by: John Devlon | last post by:
Hi, I have a problem using a hyperlink and a frameset... When I run the application, and click on the link, the link is displayed in a new window... But the strange thing is, I set the target to the target frame.... using an html Very strang....
1
1535
by: ojsimon | last post by:
Hi I am having a problem fixing a bug with my site, which affects both IE and Opera, but does not affect Safari, Firefox or any other browser that i know of. the affected part goes like this. 1) The page widgetprep.html - This page creates the structure of the widget and shows the frame of google <bgcolor="black"> <div...
0
7854
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main...
0
7783
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language...
0
8132
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. ...
0
8296
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that...
0
6533
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then...
1
5665
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes...
0
3790
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in...
1
2295
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
0
1118
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.