Is it possible to do this? Say I want to find out where on the screen a specific div is, and i want to know the values of the left and top properties. Can i find this out? If so, how?
View 14 RepliesI've been trying the find the (x,y) co-ordinates of an element. I've been using;
document.getElementById(element).style.top
document.getElementById(element).style.left
However this doesn't always work in my script. Now, I've googled how to find the position of an element. And come accross many scripts which supposedly all find the position of any object. Some are very long scripts and some are very short all using a variety of methods. Incidently none of which work, they all return (0,0).
I've been trying the find the (x,y) co-ordinates of an element. I've been using;
Code:
document.getElementById(element).style.top
document.getElementById(element).style.left
However this doesn't always work in my script. Now, I've googled how to find the position of an element. And come accross many scripts which supposedly all find the position of any object. Some are very long scripts and some are very short all using a variety of methods. Incidently none of which work, they all return (0,0). I have a question, why would someone create a script to do what one line of code can do? Am I missing something.
Is this possible at all this element is notabsolutelypositioned?
View 2 Replies View RelatedIs there any way in Javascript to find the position of an element relative to the screen rather than the browser viewport? I can't find anything.
Is this possible? The reason I ask is I wish the values to be used in Java, which needs coordinates relative to the screen.
How can I get the position of an element such as a div?
View 2 Replies View RelatedI am trying to dynamically find the position of an anchor on the page. I have a page where you can get to the anchor in the normal way (http://www.mypage.com/index.html#anchorname), but there is a script on that page that adds fields dynamically. This causes IE to lose the place where it was supposed to scroll to (via the anchor).
After the fields are added, I want to rescroll to the location of the anchor. Here is the code that I have running on the page. Code:
I got a script from brothercake which gets the absolute position for an element. Its pretty neat - recursively adding up offsets. I got it from the image transition scripts on his site.
However, this script uses offsetTop, offsetLeft and offsetParent, which dont seem to be supported by FireFox (or maybe I'm doing something wrong).
Here's brothercake's script:
getRealPosition = function()
{
this.pos = (arguments[1] == 'x') ? arguments[0].offsetLeft : arguments[0].offsetTop;
this.tmp = arguments[0].offsetParent;
while(this.tmp != null)
{
this.pos += (arguments[1] == 'x') ? this.tmp.offsetLeft : this.tmp.offsetTop;
this.tmp = this.tmp.offsetParent;
}
return this.pos;
}
It seems to work for Opera and IE - but not FF. Cant say for other browsers. I've come to rely on it for a part of my 'cross-browser' page. Any thoughts on what I can do?
What I can't figure out is why it seems to work fine on brothercake's site - even in FireFox. I'm supposing that the positioning script must be working because the images appear in the right spot.
I have generated menus from an XML file. The XML also defines sub menus that are to open when the mouse is over any one of the menus.The menus are div tags with text in them. The location of each is based on the order that they added in and the width of the text with some padding.When the users mouse moves over the menu item it should pop up a sub menu at a relative position to the menu item.How do I get that position and width of the menu the user is over if it has never been set explicitly? Is there a way or not? If not what is the best solution for something like this?
View 1 Replies View RelatedI need to come up with a function
function regExpPos (text, re, parenNum) { ... }
that will return the position within text of RegExp.$parenNum if there
is a match, and -1 otherwise.
For example:
var re = /some(thing|or other)?.*(n(est)(?:ed)?.*(parens) )/
var text = "There were some nesting parens in the test";
alert (regExpPos (text, re, 3));
should show 17
Would anyone have one of these?
Is there a possibility to find out the coordinates, relative to the whole
screen, or at least relative to the browsewindow, where an element ( e.g. link or
picture ) begins or ends?
I am hoping you can help me. I am finding this problem rather complex to solve. I need to be able to find the surrounding text at the mouse position. For example, if a user clicks on a word in a paragraph, I need to programmatically know what the text is surrounding the click point. The text in question is not just content text, but DOM elements read in as text rather than the DOM element itself. For example, if a user clicks at the word "This" in the following:
<table><tr><td>This is good</td></tr> then I would like to know how to get the text "<td>" just before the "This" as text, not as a DOM element. Furthermore, how can I "enlargen" the scope of my capture, such that I can programmatically get the "<table><tr><td>" part as well as the "is good</td></tr>" part?
Question 1
----------------
I am writing an advanced BBCode system for my forums and I would like
to be able to find where the cursor was positioned last in the text so
I could insert the BBCode there.
Question 2
----------------
Again I am writing an advanced BBCode system for my forums and I would
like to make is so that when someone puts in a [b] tag it goes bold, so
kind of a WYSIWYG editor and also for other things like [img] tags and
[url] tags. So could someone tell me how to do that. I would preferably
like it to still use the textarea tag, or at least a form component so
my existing code works.
I want to do something but here is an example. (That explain much more) : Here you have a toolbar called content-header. It change from position:static to position:fixed if it leave the screen. (whan you scroll down) I want to do the same thing with my first <tr> : That way on a my long table you will never loose the title of each columns. I tried to copy this website by using his stuff but it didn't work.
View 2 Replies View RelatedI'm trying to place a countdown timer i have in a specific spot on a website I'm building......any thoughts on how i would do this?
View 3 Replies View RelatedI have following problem: I get screen coordinates something (which might not be a mouse) and have to convert them relative to an element on a page.
Inside a page it's simple: use the offsets to the parent elements.
On the other side the start are the window.screenX and window.screenY coordinates.
The only problem now is how to find out the offset from the page to the window, i.e. the size of the toolbars and stuff? What might be interesting are the mozInnerScreenX/Y attributes of an window. But these are only present in firefox, obviously, which is not sufficient.
A hack would be a calibration page which uses a mouse event to calculate the missing offset using evt.pageX/Y and evt.screenX/Y. But this might not work, since a mouse might not be present.
When datepicker is used on buttons positioned at the bottom of thescreen it only displays part of the datepicker popup. The default position should be bottom, but if it reaches beyond the end of the screen the position should be above/top. Does anyone know how to control this ?Current code:
// set DatePicker defaults
$.datepicker.setDefaults({
dateFormat: 'dd/mm/yy',
[code]....
Is it possible to make the mouse be at a given position on the screen using javascript for example i am writing a element resize script and i would like to have it so when u click on the resize button the cursor moves to the bottom right corner of the element for the starting position
View 3 Replies View RelatedHow to make a footer for a web that has an absolute position and automatic detect lower part of the screen. Whenever the visitor scroll the page, the footer still there and remain to it's position. Just like a header that has {position: absolute} in css.
View 3 Replies View RelatedI'm looking to grab the width of an <li>, including padding and margins that doesn't have a set width, and has one of 'auto' or 0.
View 5 Replies View RelatedI forget how to do this. Maybe somebody can point me to a decent tutorial. But I'm looking to grab the width of an <li>, including padding and margins that doesn't have a set width, and has one of 'auto' or 0.
View 4 Replies View RelatedI'm fairly new to jquery and I've been stumped on this one for a day now. I'm creating a lighbox type photo gallery on a page. The box is simply a hidden div that is displayed when the user clicks a link. When the link is clicked to launch a gallery I'm using the .load() function to grab another page and load it into the hidden div which is now displayed.
The code looks like this $('#galleryBox').load('boxModal.php?ID=' + ID)); The issue I'm having is after I load up the gallery box with boxModal.php.. I want to be able to respond to the click or mouseover event of the images that have loaded in that box. But I can't seem to find the images in the DOM. Is it possible to add event handlers to images loaded using the .load() function?
I have a calendar in which each day is a separate div, and all these are within a container div #cal. When a user mouses over one of the days, I want to figure out the index number of that day's div within #cal. Simplified example:
<div id="cal">
<div onmouseover="findIt()" id="nov1">1</div>
<div onmouseover="findIt()" id="nov2">2</div>
<div onmouseover="findIt()" id="nov3">3</div>
</div>
I can easily get the index of #nov2 from Firebug if I do this in the console:
$('#cal div').index($('#nov2')
But, I can't figure out how to write a function so that I don't need to assign an id to each day div. I'd like to be able to just take "this" from the moused-over div, and pass that to a function that can turn it into the needed index.
I am working on a little project with fullcalendar but while writing some callback functions stumbled upon an issue: Fullcalendar generates html that looks like this: <a><span></span><span></span><span></span></a>.
Now there is an eventClick callback that is fired when clicking on that <a> element. However, in that callback I would like to know which <span> element was clicked.
Since jQuery parses the entire dom first, is there any efficiency gain in directing it via the entire CSS chain rather than directly to an ID? That is, if I have a Div with an ID of "foo" and it contains a P with an ID of "bar", is there any speed advantage in using $(div#foo p#bar) as opposed to just using $(p#bar), assuming jQuery would be more efficient if it had both indexes?
View 2 Replies View RelatedI'm trying to add a click listener to a list element that has a hidden unordered list.
<script type="text/javascript">
$(function(){
$('li:has(ul)').click(function(event)
{
[Code]....
Basically, I'm looking for a way to find a list element that has a ul child, and then hide or show that ul. What I have here doesn't seem to be working.