473,230 Members | 1,830 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,230 software developers and data experts.

Re: Adding CSS units to an old JS Script

SAM
rfr a écrit :
I am a cut-n-paste javascript user and trying to update this script.

I have tried adding +"px" to the barW and barH lines. But that didnt get it
to work.
This below works for me in Firefox,
you can put this script in the head of your page(s)

Expand|Select|Wrap|Line Numbers
  1. <script language="JavaScript1.2" type="text/javascript">
  2.  
  3. // Based on watermark script by Paul Anderson, CNET Builder.com.
  4. // All rights reserved.
  5.  
  6. // and then ?
  7. // it was no more working ... so ... the rights ...
  8.  
  9. var markW = 90, // pixels wide
  10. markH = 40, // pixels high
  11. markX = 99, // percent right
  12. markY = 99, // percent down
  13. markRefresh = 50; // milliseconds
  14.  
  15. var posX, posY, wMark, navDOM, markID;
  16.  
  17. function setVals() {
  18. var barW = 0; // scrollbar compensation for PC Nav
  19. var barH = 0;
  20. if (navDOM)
  21. {
  22. if (document.height innerHeight) barW = 20;
  23. if (document.width innerWidth) barH = 20;
  24. }
  25. else
  26. {
  27. innerWidth = document.body.clientWidth;
  28. innerHeight = document.body.clientHeight;
  29. }
  30. posX = ((innerWidth - markW)-barW) * (markX/100);
  31. posY = ((innerHeight - markH)-barH) * (markY/100);
  32. }
  33.  
  34. function wRefresh() {
  35. wMark.left = posX + (navDOM?pageXOffset:document.body.scrollLeft) +'px';
  36. wMark.top = posY + (navDOM?pageYOffset:document.body.scrollTop) + 'px';
  37. }
  38.  
  39. function markMe() {
  40. // set common object reference
  41. wMark = document.all ? document.all['waterMark'].style :
  42. document.getElementById?
  43. document.getElementById('waterMark').style :
  44. document.waterMark;
  45. navDOM = window.innerHeight; // Nav DOM flag
  46. wMark.width = markW;
  47. wMark.height = markH;
  48. setVals();
  49. window.onresize=setVals;
  50. markID = setInterval ("wRefresh()",markRefresh);
  51. }
  52.  
  53. window.onload=markMe; // safety for Mac IE4.5
  54.  
  55. </script>

This script works with an associated div somewhere (preferably at end)
in the body of the page :

Expand|Select|Wrap|Line Numbers
  1. <div id="waterMark" style="position:absolute">
  2. <a href="#" onClick="window.scrollTo(0,0)">
  3. top
  4. </a>
  5. </div>

--
sm
Jun 27 '08 #1
4 1331
rfr
Thank you.

That does work in FireFox, Opera and Netscape. But it does not work in MSIE
7.0.

I have no idea why it doesnt work in MSIE 7.0

And since MSIE is such a large part of the visitor audience, it has to work
there too.

"SAM" <st*********************@wanadoo.fr.invalidwrote in message
news:48*********************@news.orange.fr...
rfr a écrit :
>I am a cut-n-paste javascript user and trying to update this script.

I have tried adding +"px" to the barW and barH lines. But that didnt get
it to work.

This bellow works for me in Firefox,
you can put this script in the head of your page(s)

Expand|Select|Wrap|Line Numbers
  1. <script language="JavaScript1.2" type="text/javascript">
  2. // Based on watermark script by Paul Anderson, CNET Builder.com.
  3. // All rights reserved.
  4. // and then ?
  5. // it was no more working ... so ... the rights ...
  6. var markW = 90, // pixels wide
  7.     markH = 40, // pixels high
  8.     markX = 99, // percent right
  9.     markY = 99, // percent down
  10.     markRefresh = 50; // milliseconds
  11. var posX, posY, wMark, navDOM, markID;
  12. function setVals() {
  13.  var barW = 0; // scrollbar compensation for PC Nav
  14.  var barH = 0;
  15. if (navDOM)
  16.    {
  17.    if (document.height innerHeight) barW = 20;
  18.    if (document.width innerWidth) barH = 20;
  19.    }
  20. else
  21.    {
  22.     innerWidth = document.body.clientWidth;
  23.     innerHeight = document.body.clientHeight;
  24.     }
  25. posX = ((innerWidth - markW)-barW) * (markX/100);
  26. posY = ((innerHeight - markH)-barH) * (markY/100);
  27. }
  28. function wRefresh() {
  29. wMark.left = posX + (navDOM?pageXOffset:document.body.scrollLeft) +'px';
  30. wMark.top = posY + (navDOM?pageYOffset:document.body.scrollTop) + 'px';
  31. }
  32. function markMe() {
  33. // set common object reference
  34. wMark = document.all ? document.all['waterMark'].style :
  35.         document.getElementById?
  36.             document.getElementById('waterMark').style :
  37.         document.waterMark;
  38. navDOM = window.innerHeight; // Nav DOM flag
  39. wMark.width = markW;
  40. wMark.height = markH;
  41. setVals();
  42. window.onresize=setVals;
  43. markID = setInterval ("wRefresh()",markRefresh);
  44. }
  45. window.onload=markMe; // safety for Mac IE4.5
  46. </script>


This script works with an associated div somewhere (preferably at end) in
the body of the page :

Expand|Select|Wrap|Line Numbers
  1. <div id="waterMark" style="position:absolute">
  2. <a href="#" onClick="window.scrollTo(0,0)">
  3.   top
  4.   </a>
  5. </div>


--
sm
Jun 27 '08 #2
rfr
What changes to I need to make to this script to get it to also work in
MSIE?

"rfr" <rf******@iw.netwrote in message
news:3v******************************@prairiewave. com...
Thank you.

That does work in FireFox, Opera and Netscape. But it does not work in
MSIE 7.0.

I have no idea why it doesnt work in MSIE 7.0

And since MSIE is such a large part of the visitor audience, it has to
work there too.

"SAM" <st*********************@wanadoo.fr.invalidwrote in message
news:48*********************@news.orange.fr...
Jun 28 '08 #3
SAM
rfr a écrit :
What changes to I need to make to this script to get it to also work in
MSIE?
That would have to (IE4 ?)

Here you are (tested IE6, Fx2, Safari3)
Doesn't work with my IE Mac if the div marker has no border :



Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  2. "http://www.w3.org/TR/html4/strict.dtd">
  3. <html>
  4. <head>
  5. <meta http-equiv="content-type" content="text/html; charset=utf-8">
  6. <title>down marker</title>
  7. <script language="JavaScript1.2" type="text/javascript">
  8.  
  9. // Based on watermark script by Paul Anderson, CNET Builder.com.
  10. // All rights reserved.
  11.  
  12. // all the script is modified so ... the rights !!!
  13.  
  14. // variable for test :
  15. n= 0;
  16.  
  17. // fixing some values :
  18. var markW = 90, // pixels wide
  19. markH = 40, // pixels high
  20. markX = 99, // percent right
  21. markY = 99, // percent down
  22. markRefresh = 200; // milliseconds
  23.  
  24. // some needed variables :
  25. var posX, posY, wMark, navDOM, markID;
  26.  
  27. function setVals() {
  28. var barW = 0; // scrollbar compensation for PC Nav
  29. var barH = 0;
  30. if (navDOM)
  31. {
  32. if (document.height innerHeight) barW = 20;
  33. if (document.width innerWidth) barH = 20;
  34. }
  35. else
  36. {
  37. /*@cc_on var innerHeight, innerWidth; @*/
  38. innerWidth = !document.documentElement.clientWidth?
  39. document.body.clientWidth :
  40. document.documentElement.clientWidth;
  41. innerHeight = !document.documentElement.clientHeight?
  42. document.body.clientHeight :
  43. document.documentElement.clientHeight;
  44. }
  45. posX = ((innerWidth - markW)-barW) * (markX/100);
  46. posY = ((innerHeight - markH)-barH) * (markY/100);
  47. }
  48.  
  49. function wRefresh() {
  50. wMark.left = +posX + (navDOM? pageXOffset :
  51. !document.documentElement.scrollLeft?
  52. document.body.scrollLeft :
  53. document.documentElement.scrollLeft) + 'px';
  54. wMark.top = +posY + (navDOM? pageYOffset :
  55. !document.documentElement.scrollTop?
  56. document.body.scrollTop :
  57. document.documentElement.scrollTop) + 'px';
  58. // these 2 lines for test
  59. n++;
  60. window.status = 'refresh #'+n;
  61. }
  62.  
  63. function markMe() {
  64. // set common object reference
  65. wMark = (document.all && !document.getElementById)?
  66. document.all['waterMark'].style :
  67. document.getElementById?
  68. document.getElementById('waterMark').style :
  69. document.waterMark;
  70. navDOM = window.innerHeight; // Nav DOM flag
  71. wMark.width = markW + 'px';
  72. wMark.height = markH + 'px';
  73. setVals();
  74. window.onresize=setVals;
  75. markID = setInterval ("wRefresh()",markRefresh);
  76. }
  77.  
  78. window.onload=markMe; // safety for Mac IE4.5
  79.  
  80. </script>
  81. </head>
  82. <body>
  83. <DIV id="waterMark" style="position:absolute;border:1px solid">
  84. <a href="#" onClick="window.scrollTo(0,0);return false;">
  85. top signal
  86. </a>
  87. </DIV>
  88. <p style="border:1px solid;height:1500px;width:2000px">
  89. <a href="javascript:clearInterval(markID)">stop refreshing</a>
  90. </p>
  91. </body>
  92. </html>


--
sm
Jun 29 '08 #4
SAM
SAM a écrit :
>
Here you are (tested IE6, Fx2, Safari3)
Doesn't work with my IE Mac if the div marker has no border :
And now compatible NC 4.7 !



Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  2. "http://www.w3.org/TR/html4/strict.dtd">
  3. <html lang="fr">
  4. <head>
  5. <meta http-equiv="content-type" content="text/html; charset=utf-8">
  6. <title>down marker</title>
  7. <script language="JavaScript1.2" type="text/javascript">
  8.  
  9. // Based on watermark script by Paul Anderson, CNET Builder.com.
  10. // All rights reserved.
  11.  
  12. // all the script is modified so ... the rights ... p-) !!!
  13. // tested Mac OS X 10.4 : IE.5, Fx.2, Safari.3, Opera.9, iCab.3
  14. // tested Win XP SP2 : IE.6, NC.4.7
  15.  
  16. // variable for test and to remove after try :
  17. n= 0;
  18.  
  19. // fixing some values :
  20. var markW = 90, // pixels wide
  21. markH = 40, // pixels hight
  22. markX = 99, // percent right
  23. markY = 99, // percent down
  24. markRefresh = 200; // milliseconds
  25.  
  26. // some needed variables :
  27. var posX, posY, wMark, navDOM, markID;
  28.  
  29. function setVals() {
  30. var barW = 0; // scrollbar compensation
  31. var barH = 0; // scrollbar compensation
  32. if (navDOM)
  33. {
  34. if (document.height innerHeight) barW = 20;
  35. if (document.width innerWidth) barH = 20;
  36. }
  37. else  // for IE
  38. {
  39. /*@cc_on var innerHeight, innerWidth; @*/
  40. innerWidth = !document.documentElement.clientWidth?
  41. document.body.clientWidth :  // old IE and IE Mac
  42. document.documentElement.clientWidth;
  43. innerHeight = !document.documentElement.clientHeight?
  44. document.body.clientHeight :  // old IE and IE Mac
  45. document.documentElement.clientHeight;
  46. }
  47. posX = Math.floor(((innerWidth - markW)-barW) * (markX/100));
  48. posY = Math.floor(((innerHeight - markH)-barH) * (markY/100));
  49. }
  50.  
  51. function wRefresh() {
  52. wMark.left = +posX + (navDOM? pageXOffset :
  53. !document.documentElement.scrollLeft?
  54. document.body.scrollLeft :
  55. document.documentElement.scrollLeft) +
  56. (!document.getElementById? '' : 'px');
  57. wMark.top = +posY + (navDOM? pageYOffset :
  58. !document.documentElement.scrollTop?
  59. document.body.scrollTop :
  60. document.documentElement.scrollTop) +
  61. (!document.getElementById? '' : 'px');
  62. // those 2 lines for test (to remove after try)
  63. n++;
  64. window.status = 'refresh #'+n;
  65. }
  66.  
  67. function markMe() {
  68. // set common object reference
  69. wMark = (!document.getElementById && document.all)?
  70. document.all['waterMark'].style :
  71. document.getElementById?
  72. document.getElementById('waterMark').style :
  73. document.layers ?
  74. document.layers['waterMark'] :
  75. document.waterMark;
  76. navDOM = window.innerHeight; // Nav DOM flag
  77. // next line to remove after test
  78. alert(navDOM);
  79. wMark.width = markW + 'px';
  80. wMark.height = markH + 'px';
  81. setVals();
  82. window.onresize=setVals;
  83. markID = setInterval ("wRefresh()",markRefresh);
  84. }
  85.  
  86. window.onload=markMe; // safety for Mac IE4.5
  87.  
  88. </script>
  89. </head>
  90. <body>
  91. <div id="waterMark" style="position:absolute;border:1px solid">
  92. <a href="#" onClick="window.scrollTo(0,0);return false;">
  93. top signal
  94. </a>
  95. </div>
  96. <p style="height:1500px;width:1500px/* not used by NC*/">
  97. <a href="javascript:clearInterval(markID)">stop refreshing</a><br>
  98. <img src="#" width=1500 height=1500 alt="for NC to get scrollbars">
  99. </p>
  100. </body>
  101. </html>

--
sm
Jun 29 '08 #5

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

Similar topics

1
by: Nick Goloborodko | last post by:
Hi, I've got the following problem: i need to build a "progress bar" with JavaScript. So far i have the following configuration: i've got a DIV inside of a DIV. Each DIV has a style attribute...
4
by: David Link | last post by:
Hi, Why does adding SUM and GROUP BY destroy performance? details follow. Thanks, David Link s1.sql: SELECT t.tid, t.title, COALESCE(s0c100r100.units, 0) as w0c100r100units,
5
by: Javaman59 | last post by:
I just saw an interesting identifier in a C# book I'm reading... double dollarsPerHead This jumped out at me, as it is not common to put units in an identifer. We don't see...
10
by: Trevor | last post by:
Hey, I am trying to do this tutorial on the microsoft site : http://msdn.microsoft.com/library/default.asp? url=/library/en-us/dndotnet/html/usingadonet.asp I can get everything to work up to...
5
by: yawnmoth | last post by:
I'm having some difficulty with adding elements to a webpage via the DOM. The following works: main.htm: <script> js = document.createElement('script'); js.src='test.js';...
2
by: TheSeeker | last post by:
Hi, As part of a larger project, I am trying to use the GNU Units program to provide unit conversions between quantities. My first iteration, which worked OK, was to simply use units as a...
4
by: Paul Rubin | last post by:
I'm sure this has been done before, but it just struck my fancy, an example of Python's "emulating numeric types", inspired by the old Unix "units" utility, and the Frink language. The language...
9
by: Kiamari | last post by:
here's what i have to do: Modify the Inventory Program so the application can handle multiple items. Use an array to store the items. The output should display the information one product at a...
6
lotus18
by: lotus18 | last post by:
Hello World I have this code that displays this report http://www.friendster.com/photos/27310554/1/856419939http://photos-554.friendster.com/e1/photos/45/50/27310554/1_856419939l.jpg ... ...
0
by: VivesProcSPL | last post by:
Obviously, one of the original purposes of SQL is to make data query processing easy. The language uses many English-like terms and syntax in an effort to make it easy to learn, particularly for...
3
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 3 Jan 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). For other local times, please check World Time Buddy In...
0
by: jianzs | last post by:
Introduction Cloud-native applications are conventionally identified as those designed and nurtured on cloud infrastructure. Such applications, rooted in cloud technologies, skillfully benefit from...
2
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 7 Feb 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:30 (7.30PM). In this month's session, the creator of the excellent VBE...
0
by: stefan129 | last post by:
Hey forum members, I'm exploring options for SSL certificates for multiple domains. Has anyone had experience with multi-domain SSL certificates? Any recommendations on reliable providers or specific...
0
by: MeoLessi9 | last post by:
I have VirtualBox installed on Windows 11 and now I would like to install Kali on a virtual machine. However, on the official website, I see two options: "Installer images" and "Virtual machines"....
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: Aftab Ahmad | last post by:
Hello Experts! I have written a code in MS Access for a cmd called "WhatsApp Message" to open WhatsApp using that very code but the problem is that it gives a popup message everytime I clicked on...
0
by: Aftab Ahmad | last post by:
So, I have written a code for a cmd called "Send WhatsApp Message" to open and send WhatsApp messaage. The code is given below. Dim IE As Object Set IE =...

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.