I am working on implementing a carousel-style switcher (using a pre-built script dependent on the MooTools library) on the home page of one of my Web sites. The script displays a series of thumbnail images. When the user clicks on one of those thumbnails, an AJAX request returns the following items, which are then switched out using javascript:A background image (usually between 50 and 100 kilobytes)A foreground image (usually between 10 and 20 kilobytes)A header for the promotional item (strictly text)The body text of the promotional item (text and HTML code, generally no more than 200 characters of text)I have all of that working properly.
When the user clicks on the thumbnail, the AJAX function executes. Then, I use javascript to invoke a new Image() object to load the background image. Once that's completed, I invoke another Image() object to load the foreground image. Once both requests are fully loaded, I switch out the information. While they are working, I display an animated gif that indicates the information is loading. However, if at all possible, I would like to implement a progress indicator rather than just a simple animated gif. Because of the size of the background images, it can sometimes take between 10 and 15 seconds to load on a dial-up connection (even longer if the user's connection is especially slow or overloaded).
That's a long time to sit and stare at a "loading" image, especially if there's no way to indicate whether it's going to actually do anything or if it's just completely stalled. I am already sending the filesize of the background image and the foreground image to my javascript using the AJAX request, so if I need to use that somewhere in my script, I can easily do that. However, I've hit a roadblock in trying to figure out if there's a way to determine how much the user has actually downloaded successfully. From most of my research, it does not seem possible (due to security issues) to determine any sort of file size on the user's local computer using javascript.
However, the majority of the information I've found on the subject seems to relate to the opposite type of situation (users uploading files rather than downloading). The few examples I've been able to find for "download indicators" seem to simply count the total number of images being loaded, then divide 100 by that count. Then, for each image that loads, it adds that percentage to the indicator. Since I will always be loading two images, that means that my download indicator would always display 0%, 50% or 100%, which isn't much more helpful than the animated "loading" gif I'm already using. Is there any way to use javascript to determine how much (percentage-wise or in bytes) of a file a user has downloaded from the server into their cache?
I'm just starting to learn jQuery actually.. I downloaded the starterkit, unpacked it and also downloaded the latest jQuery file from this website.. all referenced to with the right path in the file but for some reason it doesn't work! I also tried the link to the jQuery file on Google but still the same problem.. I know the path is right because when I view source and click on the link, the right file opens.
If I click the 'Run Code' button on the homepage here it does what it's supposed to do, just on my own computer nothing works?
I have an application that resizes itself upon window resize. Theproblem is that if I resize down the window so it is smaller, twoscrollbars appear during resize (nothing new for now...), but thecomputed body width is the width with the scrollbars.Then, when I stop resizing, my app resizes itself, but as you may haveguessed, there are a small empty space on right and bottom,corresponding to the scrollbars.I have not found a pretty way to do it (of course I could set a timerinside my resize function that will call itself again 10ms later, just
I have a small function that replaces an image with that of a clicked thumbnail (and updates some text). Is it possible to display a loader whilst the new image is being downloaded?code...
I don't know if anyone here has downloaded the dev edition of windows 8 yet (it was released last night 5:00p, est)I am trying to get jquery to work, but it just wont... I tried simple stuff, but I was hoping someone here knew how.
been trying to maintain a memorial website that we had created when my sister passed away. It was hosted somewhere but the person who made it couldn't maintain it anymore, so I downloaded all of the pages and rebuilt it on my linux server. Heres the site:If you poke around on there you will see some pages that have text that says click here for more pictures, like on the growing up page, and the baby pictures page.Thats my problem, the links dont work. The pages were created with Freeway, and alot of javascript in there that I dont understand. I have all of the pictures in the directory , no clue why they wont load?ll post the javascript that I think is the problem:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html><head><title>Baby Pictures</title>
is there a way to check if a picture has downloaded completely? What I (read: my boss) want to do is open the index-page with a picture, and after it's downloaded, reload the website to index2.php after say 4 seconds.
Is it enough to do an OnLoad in the body tag, or doesn't that include the downloading of the items/pictures on the page?
Does anyone know of a handy way to disable a user from downloading javascript when they save a page?
Here is my problem. I have javascript that disables right clicks on a page. However the user could just "save" the page to there desktop and remove the function that disables right clicks.
Anyone know of a good work around? I've heard of other complex ways, but I was looking for a simple solution.
i need to remove all lines containing text from each line in downloaded.txt from the file download.txt.So I have a function Remcon.I need Remstr = to every line of downloaded.txt , and text ill fix my self.
function remcon() { var text = document.form_rli.input_output.value;
It would be nice to be able to sort plugins by the number of times voted on. I know you can see how many times it has been voted on after you go to the detail page but it would be helpful to get that info as a sort field on the "Most Popular Plugins" page because then you could tell wether a 5 star has been voted on once or a 1000 times. I personally would rather get a 3 1/2 starred plugin voted on 1000 times then a 5 star voted on once by the developer. Don't get me wrong I would vote 5 stars on my plugin too.
I was trying to create an enable/disable button that works with AJAX. So, when a user clicks the image link, it is automatically replaced with a validating.gif image. That image is shown until the $.post() request is completed. But...the image isn't cached...it's re-downloaded every time for each link.
The image src is loaded as: validating.gif?id=1 validating.gif?id=2 validating.gif?id=3 etc. instead of just: validating.gif
I did this is because whenever a new img src was changed to "validating.gif", any existing img src's that were set to "validating.gif" would reload/restart the animation when the change occurred. Is there a way to fix this so that the animation remains uninterrupted and that the validating.gif image isn't re-downloaded for each link?
I am using .ajax() to access cross-domain data using JSONP. Because I need to be able to cache the data I want to use a static name for thejsonpCallback function, so I have set the jsonpCallback option in the .ajax() request. However that appears to requires a global function whereas the auto generated function didn't (well maybe it did but that was all hidden from me).
I definitely need to be able to cache the results. Ideally I wouldn't have a global function handling the data. Is there another way to do this? If not what is the best practice way to go about using a global function these days and how do I provide it with the context of the object/module it was called from - which is where the data is needed?
Relatively new to jQuery but have a problem with getting data to display.Using a webform with 2 forms. User slects and inputs data into the first form, clicks a button then using jQuery .ajax submits the serialized data to a php script. The script processes the input into multiple paragraphs of text which is based on the input from the first form.The data is returned to the webpage and displayed in a text area (of the 2nd form) where the user can edit it to fine tune the wording. The 2 forms are displayed in different tabs so it is easy to move back and forward between the 2 forms.
The problem occurs when the user goes back to the first form and enters or selects different text and then click the submit button to generate a whole new text for insertion into the textarea on the second form. For certain fields the modified text is displayed.However if the whole of the text in the textarea is deleted, then the user clicks the submit button to re-generate the text content area then nothing at all is ever interted into the textarea. If have user alert to check that data is returned from the php handler and this text is correct. BUT when I click on the tab to see the textarea (id is "draftrec") there is no text inserted. The relevant function is below and the line that should insert the text into the textarea is:
I would like to use jQuery to prepopulate a form - ie make a call to a php program to get data from a database and pre-populatea form with appropriate data for the user. Can anyone point me in the right direction for some examples on the simplest way to do this?
I wonder if i can make the variable data which is [data] in jQuery.post( url, [data], [callback], [type] ) dynamic. for instance, this is the form i want to send,
I am writing a small data entry screen that will post the form data to a page and return a message. But i cannot get the Success or Error functions working properly.
Here's the code where strData is the posted querystring of:
I'm not sure whether it should be in a form and using the onsubmit or click of a button.
I am still new to jQuery and I am trying to figure something out. I have this code:
[Code]...
This is working fine on itself. What is does is when I click a link it loads data into the following div. When done loading it slides out. But I want to change the appearance of the slide. I have tried to do that like this: $(this).show("slide", { direction: "down" }, 1000); But this doesn't work. When I check firebug it says the following: o.easing[this.options.easing || (o.easing.swing ? "swing" : "linear")] is not a function
I am trying to try jQuery 1.4.3 updated .data() method with HTML5 data attributes. The way I understood these changes is that an element with these attributes would automatically have their data populated by .data(). For example, if I have an element:
<ahref="#" data-cheese="cheddar">DataElement</a>
I can access this with .data('cheddar'). This part works fine. The issue I am having is that calling JUST data like $(this).data() just produces an empty object. Is this how it should be expected to function?
i am thinking of using a xml file as a data base for example , the xml file stores a list of reference numbers which is allocated to a url or a name such as 0123456789 and i have a text box on a webpage and the user types in a reference number and the javascripts reads the xml file to check if its a valid reference number i.e a registered number i am new to working with xml etc.
[Code]....
id like it to read the specific data thats contained within the tag such as 0123456789's tag = JOE
I'm trying to compare incoming JSON data to the existing data to see if there are any changes, but for giant objects like:
Code: [{"date":"2011-09-03 23:06:03","notifier_id":"1","type":"1","unread":"0"},{"date":"2011-09-05 00:37:46"}] if (JSON.stringify(oldData) == JSON.stringify(newData))
This doesn't seem to work. I've tried using:
Code: escape("'" + JSON.stringify(W.notification.list + "'")) but that ignores the objects properties and returns something like 22%5Bobject%20Object%5D%2C%5Bobject