Go Back   CodingForums.com > :: Client side development > HTML & CSS

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 12-20-2010, 02:11 PM   PM User | #1
gwolanin
New to the CF scene

 
Join Date: Dec 2010
Posts: 3
Thanks: 0
Thanked 0 Times in 0 Posts
gwolanin is an unknown quantity at this point
Moving a div within overflow div when scrolling

I have lost my touch with JavaScript recently and resorted to using pre-made code.

I am using this scrolling code: Absolute Floating Menus

I have the following coded:

Code:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
#container {
	font-family: "Lucida Console", Monaco, monospace;
	height: 200px;
	width: 450px;
	border: medium dotted #000;
	overflow: auto;
	position: absolute;
}
#cart {
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	float: right;
	height: auto;
	width: 100px;
	list-style-type: square;
	position: relative;
	list-style-position: inside;
	display: inline;
	border: thin solid #00F;
	right: 5px;
}
-->
</style>
<script type="text/javascript" language="javascript" src="js/floating-1.1.js"></script>
</head>

<body>
<p>&nbsp;</p>
<div id="container">
<div id="shop">
	<div id="cart">
      <ul>
        <li>1 </li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
      </ul>
    </div>
    <p>test</p>
    <p>test2</p>
    <p>test</p>
    <p>test2</p>
    <p>test</p>
    <p>test2</p>
    <p>test</p>
    <p>test2</p>
    <p>test</p>
    <p>test2</p>
    <p>test</p>
    <p>test2</p>
</div>
</div>
<script type="text/javascript" language="JavaScript">
	floatingMenu.add('cart',
		{
					 targetTop:10,
					 //targetBottom: 0,
					 
					 // prohibits movement on x-axis
					 prohibitXMovement: true,
					 
					 // Remove this if you don't want snap effect
					 snap: true
		});
</script>

</body>
When I scroll through the div the menu doesn't move. I am stuck in trying to get this to work.

Does anyone have any examples that will show how to move the menu down when scrolling in a div. Everything that I find will ONLY scroll the menu if the Browser is able to scroll down, then the div moves.

Thanks in advance.

Last edited by gwolanin; 12-20-2010 at 02:12 PM.. Reason: wrong title
gwolanin is offline   Reply With Quote
Old 12-20-2010, 03:18 PM   PM User | #2
xelawho
Senior Coder

 
xelawho's Avatar
 
Join Date: Nov 2010
Posts: 2,437
Thanks: 52
Thanked 453 Times in 451 Posts
xelawho will become famous soon enoughxelawho will become famous soon enough
I'm just taking a wild stab at it here, but there are a couple of things that I noticed - one is that the documentation says:
Quote:
Make sure your page has DOCTYPE set. It doesn't matter if it is HTML 4.01 or XHTML, but the script will fail to work if Internet Explorer is in quirks mode.
and I don't see a doctype in your code

the other is that you have the line:
prohibitXMovement: true

does setting that to false make a difference? (I guess I should really know which one the x axis is before asking that question )
xelawho is offline   Reply With Quote
Old 12-20-2010, 04:46 PM   PM User | #3
teedoff
Senior Coder

 
Join Date: Aug 2010
Location: High Point, NC
Posts: 3,325
Thanks: 5
Thanked 363 Times in 360 Posts
teedoff is on a distinguished road
As the above poster said, is this all your code or do you not have a valid doctype and clisong html tag? Do you have a link to your live site?
teedoff is offline   Reply With Quote
Old 12-21-2010, 02:12 PM   PM User | #4
gwolanin
New to the CF scene

 
Join Date: Dec 2010
Posts: 3
Thanks: 0
Thanked 0 Times in 0 Posts
gwolanin is an unknown quantity at this point
Thanks for the replies.

here is the live page for what I posted: demo

Here is the actual production page that I am trying to get the cart to scroll or even STAY when scrolling the DIV. The problem is the positioning is all relative to the browser page, not the DIV. I am sure I am missing something obvious and simple.
gwolanin is offline   Reply With Quote
Old 12-22-2010, 02:13 PM   PM User | #5
gwolanin
New to the CF scene

 
Join Date: Dec 2010
Posts: 3
Thanks: 0
Thanked 0 Times in 0 Posts
gwolanin is an unknown quantity at this point
Thumbs up

I contacted the developer of this script and opted for their $7 support option. They were VERY responsive and have fixed the issues.

If I can post the solution here I will, but I have a feeling that they will post it on their site.

Thank you to those that replied to help get more info.
gwolanin is offline   Reply With Quote
Reply

Bookmarks

Tags
autoscroll, child div, div, move, parent div

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

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 On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 04:39 AM.


Advertisement
Log in to turn off these ads.