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?
I 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.
I'm trying to learn a bit more Javascript/jQuery and I want to write a bit of code to adjust 'background-position' based on the width of the 'background-image'. So my short question is, How can I find the width of a background image using Javascript/jQuery? For those who are interested in what I'm doing (or trying): I have a list where each item has a background image along with some text. I want the images to all centrally-align along a vertical axis in a space to the left of the text. Problem is, the images are different widths, so I want to use jQuery to find their widths and calculate the appropriate background-position.
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 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).
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.
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.
I 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));
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?
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?
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'm really not sure how to go about doing this, so any and all pointers are welcome. What I'd like to do is be able to find the position and width of a word that has been typed inside of a <textarea>, so that I might overlay some absolutely-positioned elements on top, and size them properly. I would really like to be able to do this in the most general case as possible (independent of fonts, font size, size of the textarea, etc.), but as stated any help is welcome.
i,m trying to make a map who show me as position A and a target adress as point B.I have made it so i can choose adress a and adress b from a dropdown but i want to automaticly load my position as possition A then choose position B from a dropdownlist. How can i do this ?
let me try to explain better what I'm trying to do. I'm a real newbie I don't know much javascript but I understand more or less the logic behind it... tell me if this solution should work and if you know how to do it please show me. [URL]... I need to make div#photo's width to match the total width measurement of all the images it contains. If you load the page and you don't touch the size, it will work fine... but that's not realistic. If I resize the page, which will happen often on this kind of page (I'm assuming), the whole thing goes haywire (try it, scroll to the last image and resize the page you'll see what I mean). What can I do? Is my idea the right solution? Am I not explaining this clearly enough? Let me know please, I'm desperate. I've been trying to get CSS to do this for me for 3 hours now. Nothing works.
Is there any way that one could have supersubs functionality applied to drop-down multi-column menus?I assume one would need to calculate the width of each column plus the combined width for the container.
I currently have a website where i share thoughts with my friends (some kind of forum) and within this 'forum' people can post pictures they made but most of the time these pictures exceed the max width of my website so my website gets all streched out!So this is what i want: all images on the page must run thru some sort of function which checks if the image image width exceeds the max_width. if it does then the script must calculate how many pixels the current width exceeds the max_width and get this number so that the script does: current_width = current_width - (max_width - current_width)
I've recently start using Flexigrid (old JQuery grid plugin), and, as you may know, one of the few issue this really good grid plugin got is the lack of liquid layout option. My personal idea to solve the problem is to set the "width" parameter depending on $(window).width. Here is the problem (and here's why i post this question in "General use" and not in "Plugin").
The starting, and working, code is: $(document).ready(function(){ $("#flex1").flexigrid ( {
[Code].....
This work fine for me, but I supose it could be done way much elegant... maybe somethin without "IF" that could emulate the "%", like var percentage = $(#div.id).width()*0.XX with the 0.XX picked from an array of percentage, one for each column. Probably I should set up a function... ahhhh, as you may easily see I'm a total beginner with JQuery (and JS in general...)
I am trying to setup a javascript function that sets a div's width based on the combined width of the li's with the name "navItem". The problems I have been running into when trying to define the width of the li's is that they do not have a width defined in css. Can anyone help me out with this? The javascript function setWindow is suppose to show the div loginWindow and set the width of it.
Is the next jQuery code the best way to decrease an elements width?[code]I tried using the next code:[code]but that's not working, also not with '-20'.Maybe it's an idea to add this functionality? It's is already used in the .animate() function for changing the position of an element.
I need a code that when a button or image is clicked then a div's width and height are changed.
Ive managed to get a few codes that does this, but the real problem is that, the contents of the div is an embedded flash file and i thought that by setting the flash width and height to 100% then the flash would fit to the new size of the div, but it just didnt work.
I need a code that when a button is clicked then the div's and the flash's width and height are changed.
please have a look at the temp website latinunit net / temp / , you will understand where im coming from.
on the right hand side i have a flash chat in a div , div is controled by a script that allows it to follow the scrollers up and down.
My goal is to add a little button in the same div that says expand or maximise so when clicked the the div expands aswell as the flash file.
I'm new to javascript and am not sure why this works in firefox and not chrome. I am trying to create a script that keeps an object fixed horizontally while bing positioned absolute vertically. if I replace the toPP variable in document.getElementById('fire').style.top = toPP; with say '50px' it will move the element down 50 pxs, but how I have it currently it doesn't do anything in chrome
<script type="text/javascript" > window.onscroll = function() { if( window.XMLHttpRequest ) { var x = 0 -document.documentElement.scrollTop; var toP = String(x); var toPP = toP + "px";
I want to set the width of a div to be the same width of the image inside the div.The following code works great. But...The images are different widths, so both wrappers are set to the width of the first image. Without having to add an ID to each wrapper or image, can the wrapper width be set to the image width using the name of the image as the unique identifier?
jQuery: $(document).ready(function(){ var newWidth = $('div.wrapper img').attr('width'); $('div.wrapper').width(newWidth); });
