JQuery :: Modify A Script - Duplicate Several Times On A Page
Feb 12, 2011
I don't know how to write jquery scripts, but I can modify a little. I have a script I want to use, but I want to duplicate this script several times on a page. I know it has something to do with assigning classes, but I can't figure it out. I put a new instance in a div, I want to do this several times on the page, the class is thumbs, but I guess I have to have a different class for each instance, becauseon the 2nd instance (div) when I click on the thumbnail, is effects theimage in the first instance (div). I need to have each instance work indepently in each div.
I am calling 2 scripts, that are variations of the same script, and am getting unwanted duplicate output into the other div (place-holder) on an html page. I thought it was a scope issue, but that doesn't seem to make sense. The page is: [URL]
features.js $(document).ready(function() { $.get('xml/features.xml', function(f) { $('#y-place-holder').empty(); $('#y-place-holder').append('<dl class="feature" />'); $('feature', f).each(function() { var $feature = $(this); var fimageurl = $feature.attr('imageurl'); var fseries = $feature.attr("series"); var ftitle = $feature.attr("title"); var fdates1 = $feature.find('dates1').text(); var fdescription = $feature.find('description').text(); var ffeature = ''; ffeature = '<dd>'; .....
I want to do a similar effect on my site as this site has doneWith the times of the cities running along the top of my page. Their whole site is built in tables and has an insane amount of javascript in the head so I am guessing the site is quite out of date.Is there a easier/simpler/cleaner way to do this? Maybe using jQuery?
My goal: I'm trying to to create a configuration dialog and persist it so the user can edit it later. Since the configuration is long and has Datepickers, Sliders, different types of inputs and such, I'm loading a new page for the configuration and using ID to get values from them. For example, the page has a datepicker text input "startDate" and a datepicker for it.My problem:1) I load theconfigurationpage into a div of home page make a dialog out of it. jQeury moves that div to it's own div that it created in the body of home page. So when I add multiple dialogs, datepicker doesn't work anymore since there are two "#starDate" input fields in the page now. I also plenty of other cases where I use the ID directly to do other tasks. Is there a way for me to go forward with this.
What I am trying to do is insert a simple piece of javascript somewhere on the page that will modify the href location of every link on the page to a specific value defined in the script
Such as
Lets say for example the page contains 3 links
<a href="http://www.somesite.com/page1.html">Some site</a> <a href="http://www.somesite.com/page2.html">Some site 2</a> <a href="http://www.somesite.com/page3.html">Some site 3</a>
[Code]....
I am doing this so that once the bit of javascript is entered into the code of the page, all links on that page get replaced with a link pointing to a special offer page(including the original link as a variable)
how I write the javascript to update all links on the page on the fly every time the page loads??
Using the DOM the non-standard but widely implemented innerHTML extension, the following would be sufficient to modify the content of any element that can have content:
« <div id="anID">Some Content</div» with script of « document.getElementById("anID").innerHTML= "Some <em>new</emContent"; »
Where "anID" is the (unique on the HTML page) ID attribute value of the element to modify.
The script below adds support for « document.all » capable browsers. Support for NN4 is also possible, but certain issues mean that it is not listed here. Using the example above, the call would be written:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
Is it just extraneous code possibly? It seems to be ok (from right to left) in Firefox 3 but using IE and Opera, it scrolls from btm to top and I cannot figure out why.
I have obtained script for a photo gallery and have placed it on a web page. I have duplicated the html code 2 more times for the additional 2 galleries I need. The first one works, the other 2 don't (nothing happens when you click on the thumbnails). I know I need to refer to the other 2 in the javascript file, but I'm not sure how. Here is the javascript file code for 1 gallery, which I need to modify for 3 galleries, but don't know how...
clickMenu = function(menu) { var getEls = document.getElementById(menu).getElementsByTagName("LI"); var getAgn = getEls;
It's about my previous post I'm using a Java Script Calendar on external page(JavaScript). My problem is when you click on the page where the calendar is displayed it Closes down and it's visible after refreshing the page.
i'm new to JS and am trying to use an image several times on the same page, having each image show rollover behavior. The rollover code works for the first image on the page, but when I hover over subsequent images it only changes the rollover state of the first image on the page, not the image I'm hovering over. I'm using the following functions to change rollover state:
gallery_on = new Image ( ); gallery_off = new Image ( ); gallery_on.src = "gallery_on.png"; gallery_off.src = "gallery_off.png";
I got a very good select script that produces multiple values and it works fine by itself but I have two other instances of the same script on the same page. I know that multiple scripts don't work on the same page unless you execute the onChange for all three. But I dont have a clue how to do that. Code:
I am looking for a javascript function that can log the following information for each pageview:
1. The total page rendering time (not php script execution time, but the time at which the entire page is rendered from the user's perspective - all images loaded, ads served etc)
2. The URL of the page
3. The browser used to access the page
4. The country the page was accessed from
The script should then store the information in a database via an AJAX call after it's been collected.
It sounds like a tall order, but it will help me get a picture of how fast or slow my site feels depending on where you live (e.g. how far you are from the server), what browser you're using, and which pages are the slowest to render (keep in mind this is not script execution time or query time, but literally the time at which the page starts to render, to when it finishes rendering).
I have a single webpage that contains information on all 50 U.S. states. There are 50 links at the top to jump down to the state you want, and at the bottom of the information for each state a Back to Top link.
I'm making the Back to Top link into something more complex, and it will require three or four lines of code.
So that I don't have to repeat the code 50 times, and create a burden when I need to edit it, I want to place it in a .js file and call it x. Then below the information for each state I'll simply have:
Does calling code from a .js file 50 times slow down the page load? Which method would load faster?
want to take this redirect script and modify it so that it rotates a banner image instead of sending the user to another page. The script works so that if the window is out of focus for 10 seconds, it redirects. The images are defined in an external style sheet so I guess I'll have to move that into the document. Also, I want it to be able to work more than once with multiple images, like if the user opens a new tab, comes back, goes to a different tab, the image should change twice. Here's the script:
<script type="text/javascript"> var xScroll, yScroll, timerPoll, timerRedirect, timerClock; function initRedirect(){
I have a javascript that displays couple of buttons, which are directional (e.g., click button it goes to a particular page). I need to have these buttons shows up multiple times in same page, each represent a different direction but buttons themself are from the same gif file. What's the most effecient way to do this?
I had help with the following script. But, it only works with specific ID, which I have to specify in the javascript code. If I wanted to have multiple sets of selection lists, I would have to duplicate the entire javascript block, which I do not want to do.
My question is, how can I make this script not have hardcoded IDs, and let those be declared where my onchange is? Is this possible? Code:
My firefox plugin called yslow that gives advice on speeding up loading times says: JavaScript scripts block parallel downloads; that is, when a script is downloading, the browser will not start any other downloads. the page load faster, move scripts to the bottom of the page if they are deferrable.
I always thought that js should be in the header. What do you think?
I cannot call a function more than one time in my page, the function is:
Code: <script> function seeBig(_this) { document.all.view_img.src=_this.parentNode.getElementsByTagName("img")[0].src; }
[Code]....
what problem I am facing is, if I want to build another table as the same as the one above, the function will not work. I know I might need give the function an ID
Try to click the button#btn 3 times... you will find the loaded testing.html will only run the script 2 times.. then it will show no script for the rest....
I tried it on chrome, firefox.
Trying to make a full ajax site may have alternative way to load and remove?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">[code]......
Based on the code above, i wanted to generate an array of input which have the ID "ordDate", so to populate the data into the input, i identify by name attribute.It works fine if i remove the ID for the input, but in my case,the ID is compulsory. Is there any workaround to cater for my needs?
I have a registration form and I woud like to make a button what after pressed some textboxe's value copied into some others. I can program it in C# but I would like to use jQuery to I dont have to postback it to the server.