Wrox Programmer Forums

Need to download code?

View our list of code downloads.

Go Back   Wrox Programmer Forums > Web Programming > JavaScript > Javascript How-To
Password Reminder
Register
| FAQ | Members List | Calendar | Search | Today's Posts | Mark Forums Read
Javascript How-To Ask your "How do I do this with Javascript?" questions here.
Welcome to the p2p.wrox.com Forums.

You are currently viewing the Javascript How-To section of the Wrox Programmer to Programmer discussions. This is a community of tens of thousands of software programmers and website developers including Wrox book authors and readers. As a guest, you can read any forum posting. By joining today you can post your own programming questions, respond to other developers’ questions, and eliminate the ads that are displayed to guests. Registration is fast, simple and absolutely free .
DRM-free e-books 300x50
Reply
 
Thread Tools Search this Thread Display Modes
  #1 (permalink)  
Old July 15th, 2004, 01:25 PM
Friend of Wrox
 
Join Date: Mar 2004
Location: Bhopal, MP, India.
Posts: 357
Thanks: 0
Thanked 0 Times in 0 Posts
Send a message via Yahoo to anshul
Default scrolling <DIV>

many u h've might seen menu which scrolls with scroll-bar.
how can i know the total height of document <BODY> ?
( including scroll-bar ).

i intend to write some function for <DIV> menu that'll scroll
when scroll-bar is scrolled.

i've code4this, but i don't like it; it is complex.
thanx.

__________________
`~@#\^%&*/\.<.\/-|+|_!:;..=?>
PHP, SEO | anshul shrivastava | mediasworks.org | FB
Reply With Quote
  #2 (permalink)  
Old July 15th, 2004, 03:18 PM
Friend of Wrox
 
Join Date: Jun 2003
Location: Harrisburg, PA, USA.
Posts: 1,998
Thanks: 0
Thanked 3 Times in 3 Posts
Default

Hello,

Using javascript; can't remember the exact properties that tell you this, but there are values for determining the screen height using javascript.

Sorry I couldn't be more helpful.

Brian
Reply With Quote
  #3 (permalink)  
Old July 15th, 2004, 04:50 PM
Friend of Wrox
 
Join Date: Nov 2003
Location: , , .
Posts: 1,285
Thanks: 0
Thanked 2 Times in 2 Posts
Default

Try something like this:

<script type="text/javascript">
var menu = document.getElementById("menu");
function refreshMenu()
{
 menu.style.top = screen.height - 150;
 menu.style.left = screen.width - 150;
}
setTimeout("refreshMenu()",1);
</script>
<div id="menu" style="width:100;height:100;background-color:black"></div>

If this works correctly, a black box will scroll with the scroll bar in the bottom-right of the page.

Snib

<><
Reply With Quote
  #4 (permalink)  
Old July 15th, 2004, 06:41 PM
richard.york's Avatar
Wrox Author
Points: 5,506, Level: 31
Points: 5,506, Level: 31 Points: 5,506, Level: 31 Points: 5,506, Level: 31
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Jun 2003
Location: Camby, IN, USA.
Posts: 1,706
Thanks: 0
Thanked 6 Times in 6 Posts
Default

I assume you want fixed positioning. You don't have to use JavaScript to accomplish this.

Use CSS:

div {
    position: fixed;
    left: 0;
    right: 0;
}

<div>
This div is fixed in place as the page scrolls.
</div>

This doesn't work in IE on its own, for IE you'll need the IE7 style sheet. http://dean.edwards.name/IE7


Regards,
Rich

::::::::::::::::::::::::::::::::::::::::::
The Spicy Peanut Project
http://www.spicypeanut.net
::::::::::::::::::::::::::::::::::::::::::
Reply With Quote
  #5 (permalink)  
Old July 16th, 2004, 03:45 PM
Friend of Wrox
 
Join Date: Mar 2004
Location: Bhopal, MP, India.
Posts: 357
Thanks: 0
Thanked 0 Times in 0 Posts
Send a message via Yahoo to anshul
Default

friends, u got wrong way. first of all, i don't want2fix the <DIV>, it looks very monotonous! and: if i use above javscript code, <DIV> scrolls opposite to direction of scroll-bar. this is not a solution, at all. u know: we h've2use document.body.clientHeight, document.body.scrollTop etc., with setTimeout()

but i don't know how2write it myself. finally, a smooth scroll of <DIV> exactly corresponding to scroll-bar scroll is desired.
Reply With Quote
  #6 (permalink)  
Old July 26th, 2004, 02:08 AM
Registered User
 
Join Date: May 2004
Location: , , Mongolia.
Posts: 1
Thanks: 0
Thanked 0 Times in 0 Posts
Send a message via MSN to sr.ganaa
Default

Just

Reply With Quote
  #7 (permalink)  
Old July 26th, 2004, 07:46 AM
Friend of Wrox
 
Join Date: Jun 2003
Location: Harrisburg, PA, USA.
Posts: 1,998
Thanks: 0
Thanked 3 Times in 3 Posts
Default

Hello,

If you specify a height, and the overflow attribute, you can get the scrollbars to appear. I imagine that you've done this, or done something similar to this to get the scrollbar working. Below are the attributes I set for a div to have scrollbars appear.

HEIGHT: 150px;
OVERFLOW-Y: scroll

The overflow sets the axis that will scroll. However, to get the total size of the browser, I'm not sure why you think the other's code as a fix; wouldn't you have to do something similar anyway to determine these attributes?

Brian
Reply With Quote
  #8 (permalink)  
Old July 26th, 2004, 07:52 AM
richard.york's Avatar
Wrox Author
Points: 5,506, Level: 31
Points: 5,506, Level: 31 Points: 5,506, Level: 31 Points: 5,506, Level: 31
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Jun 2003
Location: Camby, IN, USA.
Posts: 1,706
Thanks: 0
Thanked 6 Times in 6 Posts
Default

Actually it would be better to use overflow: auto; since overflow-y is an IE proprietary property. Its proposed for inclusion in CSS 3 but no one else has picked it up yet. Often times overflow: auto; will generate the desired effect anyway.

HTH!

Regards,
Rich

::::::::::::::::::::::::::::::::::::::::::
The Spicy Peanut Project
http://www.spicypeanut.net
::::::::::::::::::::::::::::::::::::::::::
Reply With Quote
  #9 (permalink)  
Old July 26th, 2004, 02:59 PM
Friend of Wrox
 
Join Date: Mar 2004
Location: Bhopal, MP, India.
Posts: 357
Thanks: 0
Thanked 0 Times in 0 Posts
Send a message via Yahoo to anshul
Default

var initpos, scroll, newpos, str;

function initScroll(menu) {
 str=eval('menu');
 initpos=parseInt(
  document.getElementById(str).style.top);
 }

function scrollMenu(menu) {
 scroll=parseInt(document.body.scrollTop);
 newpos=pos+scroll;
 str=eval('menu');
 document.getElementById(menu).style.top=newpos;
 str=eval('menu');
 setTimeout("stay(str)",100);
 }

now u just need2call functions externally

initScroll('scrollMenu');
scrollMenu('scrollMenu');

this is working in all browsers i use.
do few corrections, if i've typed hurrily.
code that i'd seen 2weeks before on internet is horrible- some 100 lines
Reply With Quote
  #10 (permalink)  
Old July 26th, 2004, 05:19 PM
Friend of Wrox
 
Join Date: Mar 2004
Location: Bhopal, MP, India.
Posts: 357
Thanks: 0
Thanked 0 Times in 0 Posts
Send a message via Yahoo to anshul
Default

4Netscape family corresponding property is 'pageYOffset' lieu 'document.body.scrollTop' that works4 MSIE. We need if..else or seperate function body4this distinction.

setTimeout("scrollMenu(str)",100);
is one correction i do now.

there may b more typing mistakes.
Reply With Quote
Reply


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are Off
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Javascript with <div> aware Javascript How-To 3 August 25th, 2005 05:57 AM
<marquee> scrolling swastikagaur HTML Code Clinic 2 March 30th, 2005 03:56 AM
<style> tags in a <body> vs. <div> bcat BOOK: Beginning CSS: Cascading Style Sheets for Web Design ISBN: 978-0-7645-7642-3 1 March 27th, 2005 08:50 AM
sizeable <div> johnjohn Javascript How-To 1 December 8th, 2004 08:28 PM
<A><DIV><TABLE></DIV></A> anshul HTML Code Clinic 2 July 17th, 2004 02:17 PM



All times are GMT -4. The time now is 03:15 AM.


Powered by vBulletin®
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.
© 2013 John Wiley & Sons, Inc.