Set fix positioning to a child element

Question

0.00/5 (No votes)

See more:

I have a question and have this in my mind:
"if an element has fix position in css it sticks to window and won't scrolled"

i have an article that has a title and contents like this:

XML

<article>
    <h3>Title</h3>
    <p>Content Here</p>
</article>

content is too large to fit in article so article element gets scrollbars,
i want when user scrolls the article, the title get fix position and won't scroll
and stick to the top of article.(using jquery)

excuse me for my bad english,i hope my question was clear to you!

Posted 10-Oct-13 4:54am

Moosavi S.M.

Add a Solution

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

*bjdestiny* · Answer 1 · 2013-10-10T18:33:00

Solution 1

add Style sheet property for internal

Tag that overflow:scroll;. this may be helpful to you. because if article has too much large content and if content is inside the

Tag then it will shows the scroll bar & header will be still there.

Posted 10-Oct-13 18:33pm

bjdestiny

Anoop Kr Sharma · Answer 2 · 2013-10-10T18:39:00

Solution 2

I have created fiddle for you.Check it here
Hope you want the same thing

Posted 10-Oct-13 18:39pm

Anoop Kr Sharma

Comments

bjdestiny 11-Oct-13 0:44am

Hey Anoop..
Thanks in Advanced through out your answer i found something good for my self.!! :) :)+5

Moosavi S.M. 12-Oct-13 10:58am

i saw the example but it's not what i wanted because if you try to scroll
the window, that little red div will move
i want the div to be fix either scrolling article or window!

Anoop Kr Sharma 13-Oct-13 3:44am

As you are saying that you want the div to be fix either during scrolling article or window. I have created another fiddle for you.Check it here
Hope you want something like that