How would I start to go about this? I'd like an <h3> to display and slide in whenever the user scrolls to a certain position on the page. For example, once a certain content div is 50% displayed in the viewport, I'd like the animation to fire.
View 2 RepliesI have a rightBar that i whan it to scroll together with all the rest element s of the document. but when it is starting to cover it has to slide down so we can see it all the time.
I tried
$(function(){
function positionRightBar(){
if($("#rightBar").scrollTop()<0){
$("#rightBar").scrollTop(0);
}
}
});
but it seems that the scrolltop of the rightbar stays 0 even when it is coverd
If you go on my test site: [URL]... You will see a navigation menu at the top, with an animated ball. Every time you click on one of the links in the navigation menu, you will notice that after a new page is loaded there is a sudden jump from the balls original position to it's new position. (Not that obvious in Firefox but very obvious in IE and Safari) My question is how can I resolve this.
I assumed that wrapping the code in the $(document).ready function would elimate this issue as everything inside it will load before the page contents are loaded.
[Code]...
I have a page which has large contents. If I open the dialog when page is has been opened, the dialog is fine and it closes well. Now, If I have opened my main page and scrool down to page and at the end there is a link for opening dialog, then the dialog opens to current window position and page is scrolled up to top. Now dialog has been opened but it is too below that I cant see it. I have tested that when we scroll down the jquery function takes the scrooled position as its top position and so opening popup for that relative position.
My code is.
$dialog.dialog({
title: title,
autoOpen: true,
width: width,
height: height,
modal: true,
resizable: true,
autoResize: false,
position: [0,0],
overlay: {
opacity: 0.3,
background: "black"
}}).width(eval(eval(width) - horizontalPadding)).height(eval(eval(height) - verticalPadding));
How I can open it on top of page?
I was hoping there is some way to fix this, in IE7 and 9beta when you navigate between pages from my main nav the page loads scrolled to the bottom. It seems to be pretty random and will not reproduce consistently. Is there a way to force all anchors with a certain class to scroll to the top?
View 1 Replies View RelatedI have built a site that loads new content from a database when the user hits the end of the page. This works fine in all desktop browsers and on the iPad, but is not working on the iPhone. Have tried an iPhone 3g and 4.
Here is the code:
$(window).scroll(function(){
if($(window).scrollTop() == $(document).height() - $(window).height()){
$.ajax({
type: 'POST',
url: 'nextSet.php',
data: "?dummy=" + new Date().getTime(),
dataType: 'html',
cache: false,
beforeSend: function() {
$('#scrollLoading').show();
$('#scrollLoading').html('<p><img src="/images/ajax-loader.gif" alt="loading..." /></p>');
},
success: function(response){
$('#scrollLoading').hide();
$('#resultsPageSearch p').css('margin','0');
$('#sortDrop').show();
$('select.sortddl').selectmenu('destroy');
$('select.sortddl').selectmenu({style:'dropdown'});
$('#resultsSection').append(innerShiv(response));
},
error: function (request, status, error) {
alert(request.statusText);
}});}});
I have a floating div that stays at the bottom of the browser window while the user scrolls down a long page. The div reads "scroll down for more". How can I determine the current position of the div in relation to the top of the page, not the top of the browser window. I need to determine this because I would like to hide the div when the user scrolls to the top of the last page. I have looked at offsetParent, offsetHeight, scrollHeight, etc.
I have the code for everything except determining the position of the div, or the distance of the div from the top of the page.
I have a floating div that stays at the bottom of the browser window while the user scrolls down a long page. The div reads "scroll down for more". How can I determine the current position of the div in relation to the top of the page, not the top of the browser window. I need to determine this because I would like to hide the div when the user scrolls to the top of the last page. I have looked at offsetParent, offsetHeight, scrollHeight, etc.
I have the code for everything except determining the position of the div, or the distance of the div from the top of the page.
I hired a programmer to develop a drag and drop system for my blog. The user should be able to browse one of my blog entries and click, drag and drop an image from my entry to a fixed bottom bar on that page.The problem we are facing is that when dragging an image, it wont place it on the bottom bar until the whole page is scrolled down to the bottom of the page. This is a problem because some of the pages can be very lengthy
View 2 Replies View RelatedLooking for a simple way to have a hidden element made visible when the page scrolls.
The idea is to have a back arrow appear only when the page has been scrolled horizontally.
trying something along these lines without success . code...
I have a banner that has image navigation on the lower right. The navigation links are images which, when clicked, change the banner without reloading the page. The actual switching of the banner is working when each image is clicked.
However, my problem is this:
The page itself is long and must be vertically-scrolled to see the entire content. Because of the scrolling, the banner could appear anywhere vertically on the page. And whenever I click the banner navigation hrefs, the page "jumps" so that the banner is at the top. The page should really stay in the fixed position.
I'm not sure how to set it up so that no matter where the banner section is on the scrolled page, that the page stays in the same position when the navigation is clicked.
My href's in that navigation are set up as :
Do I need something in my script so that the page won't jump? Or am I missing something in the HTML?
I've a picture and I want to show it at x,y coordinate of the screen.how do I write the code to do this on jquery (with aspnet mvc)?
View 3 Replies View RelatedIs this possible at all this element is notabsolutelypositioned?
View 2 Replies View RelatedLet's say I have a table with 5 rows;
<table id="tbl">
<tr><td>Please</td></tr>
<tr><td>help</td></tr>
<tr><td>me</td></tr>
[Code].....
Now if someone clicks on the row with content "help" (2nd), I want to catch the click with jquery .click() and know within the jquery code that the user clicked on the 2nd <tr> element within table#tbl.
If someone clicks on the <tr> with content "this", my jquery code has to return 5, because its the 5th row.
I know how to get position left - var posLeft = parseInt($('.class').position().left);
But the class I am using has the style display:none; Is there a way around this?
Why doesn't this work?
var posLeft = parseInt($('.class').css('left').replace("px", ""));
Is it possible to get the position of an object relative to the document if it's a floating object inside elements?
View 2 Replies View Relatedi would like to know the absolute position of an element (e.g. <LI>) in the browser. i nned to know it in order to place juste beside another element (e.g. submenu).
for example: i have a <li> tag which is at 400px from my browser left border (because it is inside a div which is screen centered). this <li> has a width of 180 px so if i want to know the most left position for my submenu, i should get 400 + 180 = 580 px (from the browser left border).
i tried offset but without success. in fact it returns me 0.
I have a DIV with hegiht 500 px and overflow:scroll. I have 34000 A tags in it(each new line). Every A tag has its own ID. I want to scroll to these a tags so I need to know their position. How to find these?
View 1 Replies View RelatedWhat is the best way to get the position of an element relative to the document (accounting for margins as well)?I would like to position another element over it. I'm using the offset() function but i am running into issues 1. The values for top & left returned in IE 8 (perhaps other versions) are incorrect.2. Offset() doesn't take into account margins of the element. And when margins are set to auto i cannot seem to get the correct margin values to use
View 1 Replies View RelatedI was browsing the jQuery site and the mouse position tutorial page has some questionable links.
I tried to edit the page to remove them, but the page has been locked to editing.
I have this
var x = window.event.clientX;
var y = window.event.clientY;
i get the x and y coordinates on button click
i do this x = x+10;
y = y +10;
how can I now on this position X AND Y, pop up an imageon that position??
Any idea on how to get the coordinates/position of a div element? For example I want to get the coordinates of a particular poll which is placed on my right sidebar.
I tried this, but will not work:
document.getElementById('test').style.left
Must I set the position to relative for the element test?
The snippet below is related to some code that I'm developing that will eventually cause a scrolling DIV (overflow-y:scroll) to scroll to bring a specified element into view. I actually developed the code about a year ago. The code worked under IE6, but does not appear to work under IE7. Is offsetTop still a valid means of getting the position of an element?
[Code]...
Detect if horizontal scrollbar has been scrolled?
View 2 Replies View RelatedHere's something I'm working on: for a click on a given element, I want to be able capture the x/y coordinates of the mouse -- that is, the mouse coordinates relative to the top left corner of said
element.
So far, here's what I've got:
I'm trying to get the position of a table on a page..
<table id="tab">
by using :
var x = getAbsX(document.getElementById("tab"))
var y = getAbsX(document.getElementById("tab"))
which calls:
function getAbsX(elt) { return (elt.x) ? elt.x : getAbsPos(elt,"Left"); }
function getAbsY(elt) { return (elt.y) ? elt.y : getAbsPos(elt,"Top"); }
function getAbsPos(elt,which) {
iPos = 0;
while (elt != null) {
iPos += elt["offset" + which];
elt = elt.offsetParent;
}
return iPos;
}
but the thing keeps giving me 0's for both x and y in IE but works in
Firefox. Can anyone help?