We Keep Coding

navigation appears when I scroll down page--it should appear on page load

The navigation bar appears when I scroll down the page, but I want it to appear on page load.
Here is jQuery code I am using:
<script type="text/javascript">
$(document).scroll(function() {
if ($(this).scrollTop() == 20) {
$("#floating-nav-content").slideUp(400);
} else {
$("#floating-nav-content").slideDown(600);
}
});
</script>
Here is link to where I am using this.
http://dev.servicescart.com/about
This link is only for the internal page of this site, like I said above.

If you want that to be applied on Page load, remove that scroll event and hook the action to document ready event.
Documentation for .ready() event
Description: Specify a function to execute when the DOM is fully
loaded.
$(function(){
// do your logic for slide action
});

With the help of Rahul, I did it. Here is code I used to load navigation on page load, not with scroll down wait.
<script type="text/javascript">
$( document ).ready(function() {
$("#floating-nav-content").slideDown(600);
});
</script>

The focus is not moved on the top of the page

I am using update panel and pagination links by repeater control at the bottom of the page. Now when we click on pagination links, the page is not focused on the top of the page. I have tried the folllowing jquery code
<script type="text/javascript">
$(document).ready(function () {
$("#<%=rptPager.ClientID %> a").click(function () {
parent.window.scrollTo(0, 0);
});
});
</script>
but it doesnot work... Please help me!!!

i think you were looking for window.scrollTo(0, 0);
parent.window.scrollTo(0, 0); won't work in your code, since parent will be undefined.
this.parent however, would point to the parent of the element you clicked.

Jump to iframe once it loads

Im looking for my webpage to jump to an iframe when someone click. I've found one solution which works pretty well which is this: http://jsfiddle.net/RGjCL/4/
<ul>
<li>
Class Name
</li>
</ul>
<script type="text/javascript">
function IFrameScroll(link){
window.myIframe.location=link;
window.location.hash='myIframe'
}
</script>
<IFRAME id = "myframe" onload = "setIframeHeight( this.id )" name="myIframe">
I've tried on my web and it partially works except for the fact it scrolls to the iframe before it loads so it doesn't goes that far to the bottom because once the iframe its loaded the page fully extends.
The web in question is the following: http://www.clavederock.com.ar -
The links are under the tabs "Quienes Somos" "Programacion" and "Archivo".
I hope i made myself clear so you can help me. Thanks in advance!

Try moving window.location.hash='myIframe' from the function IFrameScroll() to setIFrameHeight(), so you'll change the hash once the iframe have the desired size.
EDIT #3:
Since you need to wait until iframe is loaded in order to resize it and window.location.hash doesn't works the second time in chrome, you can try this:
<script type="text/javascript">
function IFrameScroll(link){
window.myIframe.onload = function() {
// this will ensure that the height will be updated after load
setIframeHeight('myIframe');
// This works on FF and IE, and let users to bookmark
window.location.hash='myIframe';
// and this will allow it to scroll the second time for chrome
document.getElementById('myIframe').scrollIntoView(true);
}
window.myIframe.location=link;
}
</script>
I really hope this solve your problem :)

Instead of jumping to the iframe, you could make a smooth scroll. This would give a little more time for the iframe to load after the link has been clicked.
Alternatively and probably more effectively, you could load the iframe with the rest of the page but make it invisible. Then you just need to show it when the user clicks the link
//load the page with the iframe hidden
//in css
#myIframe { visibility: hidden; }
//use jquery to make it visible when the user clicks the link
//you could do this with javascript if you don't want to import jQuery, but I find jQuery easier
$(document).ready(function() {
$('#myAnchorTagId').click(
function() {
$('myIframe').css('visibiliy', 'visible')
}
)
});

Access parent window scroll event from child inside iframe with Jquery

I have a small javascript/jquery script on page1 (an aspx page) that scrolls an iframe loaded with page2 so that it stays with you on the page as you scroll up and down page1. However, when I load page1 inside an iframe for another parent page the scroll affect doesn't work.
I've tried using window.parent in the calls, but the script still doesn't activate and scroll the page2 iframe as you scroll page1 within the iframe of the parent page (another aspx page). I hope that makes sense.
Here is the script I've tried:
<script type="text/javascript">
$(window.parent.document).ready(function () {
var $scrollingDiv = $("#IframeDir");
$(window.parent).scroll(function () {
$scrollingDiv
.stop()
.animate({ "marginTop": ($(window.parent).scrollTop() + -10) + "px" }, "slow");
});
});
</script>
It works if I just load page1 in it's own tab or window, but if I load page1 within an iframe into the parent page, it doesn't seem to see the scroll event of the parent page.
Thanks in advance for any suggestions!
Erin

See this answer Run JQuery in the context of another frame
You have to pass in the context to search in (the parent document)
// Untested
$(window.parent.document, window.parent.document).ready(function () {
var $scrollingDiv = $("#IframeDir");
$(window.parent, window.parent.document).scroll(function () {
$scrollingDiv
.stop()
.animate({ "marginTop": ($(window.parent, window.parent.document).scrollTop() + -10) + "px" }, "slow");
});
});

I also wanted the floating div within iframe and Rantul this code worked for me!
$(parent.window).scroll(function() {
//parent document scroll functions go here
});

I don't think you can call $(window.parent).scroll() from within $(document).ready() or in this case $(window.parent.document).ready(). For that matter I don't think $(window.parent).scroll() will work at all I think it needs to be $(parent.window).scroll()
This is how I've done it before:
$(document).ready(function() {
//document ready functions go here
});
$(parent.window).scroll(function() {
//parent document scroll functions go here
});
And to answer your other question, I do believe you need jQuery on the parent page as well for this to work.

Html page load at the bottom

I need an HTML page to automatically scroll down when the page loads. So basically loads at the bottom.
Can JavaScipt be used?
Please can you help me or lead my in the right direction.
All help is appreciated.
thanks

Try this:
window.scroll(0, document.documentElement.scrollHeight)

Here is a method that worked for me:
Expected outcome:
No scroll animation
Loads at bottom of page on first load
Loads on bottom of page for all refreshes
Code:
<script>
function scrollToBottom() {
window.scrollTo(0, document.body.scrollHeight);
}
history.scrollRestoration = "manual";
window.onload = scrollToBottom;
</script>
Why this may work over other methods:
Browsers such as Chrome have a built-in preset to remember where you were on the page, after refreshing. Just a window.onload doesn't work because your browser will automatically scroll you back to where you were before refreshing, AFTER you call a line such as:
window.scrollTo(0, document.body.scrollHeight);
That's why we need to add:
history.scrollRestoration = "manual";
before the window.onload to disable that built-in feature first.
References:
Documentation for window.onload: https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onload
Documentation for window.scrollTo: https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollTo
Documentation for history.scrollRestoration: https://developer.mozilla.org/en-US/docs/Web/API/History/scrollRestoration

Something like this?
<html>
<head>
<script type="text/javascript">
function moveWin()
{
window.scroll(0,10000);
setTimeout('moveWin();',1000);
}
</script>
</head>
<body onLoad="moveWin();">
<!---- TEXT HERE ---->
</body>
</html>

If you want the page to load at the bottom and not show the scrolling animation, why not add an anchor tag to the very bottom of the page and have your link go straight to it (e.g., http://www.mysite.com/hello#bottom)? Your anchor tag could look like this: <a name="bottom" id="bottom"></a>
If you are wondering why I provided both name and id in this example, name is deprecated on <a> elements as of XHTML 1.0. Until name is absolutely no longer supported by the (X)HTML standard you are using, it may be safest to use both name and id on anchors linking to a part of the same page. This was noted in W3C's XHTML 1 spec.

Using jquery you could do this:
$("html, body").animate({ scrollTop: $(document).height() }, "slow");