I am having a problem accessing and element by ID in a script that runs via 'window.onload' at the end of all my script definitions. Do the HTML elements exist at that point or should I look somewhere else for a bug?
Just posted this thread a few mins ago and for some reason it got deleted? Maybe it was because of the URL shortening I used. Anyway here is an example of what I mean
$("#scroll").hover(function(){ $(this).find(".front").stop().animate({ top:"184px"},500,function(){ $(this).find(".front").stop().animate({ top : "7px"}, 300); }); });
I try to make a scrolling picture. when mouse roll over the image with .front class will scroll down, but it has to come back after mouse roll out. the scroll down is working but I wrote a callback function, but it doesn't work.
html part <div id="scroll"> <a href="../images/big_html/babytracker_b.png"> <img src="../images/thumb_html/jukebox.jpg" /> <img src="../images/thumb_html/Tracker.jpg" class="front"/> </a> </div>
We're trying to enhance and optimize the forms in our projects with jQuery, but I don't know if something we want is possible. Nowadays we are using simple javascript to enable and disable elements in our forms, we have a part to execute when the document is loaded and another that is executed with the interaction of the user.
For example, we have a simple select with "Race" : "Caucassian", "African" and "Other", when the user selects something we enable or disable a textfield (where the user specifies the other race) depending of the election; and when the user saves the data and reopen the form to modify the elements, we execute a function that evaluates the value of the select (previously loaded from the database) and enable or disable the textfield.
We need to optimize this because we've got really large forms (sometimes with 400 different fields) and it would be great to do this in 1 step and have one file with the behaviours instead of doing this once for the interaction and once for the reload. I've been thinking in a way for subscribing to the onchange and execute it at the same time, but I don't know if there's any way of doing that...
I have a select form with id=px. I want to make the select execute a function every time an option is selected. I took the Change function and my code looks like this:
$("#px").change(function () { var str = ""; $("#px option:selected").each(function () { str += $(this).text() + " "; }); // $("div").text(str); - this line is changed with my function $('#selectable1 span.cica').css('font-size', str + "px"); }) .change();
It looks that srt variable is not working with my .css function. What is wrong? My markup is: <select id="px"> <option class="option" value="8" label="8">8</option> <option class="option" value="9" label="9">9</option> <option class="option" value="10" label="10">10</option> <option class="option" value="11" label="11">11</option> <option class="option" value="12" label="12">12</option> <option class="option" value="14" label="14">14</option> <option class="option" value="18" label="18">18</option> <option class="option" value="21" label="21">21</option> <option class="option" value="24" label="24">24</option> <option class="option" value="36" label="36">36</option> <option class="option" value="48" label="48">48</option> <option class="option" value="60" label="60">60</option> <option class="option" value="72" label="72">72</option> </select>
I'm trying to execute a simple JSON request using getJSON but I can't get a successful response. My code is below. If I run this I always receive an error. If I add "callback?" (making it JSONP) then I can see the correct results in Firebug but the call back function is never executed. function getResults(url) { var gptUrl = "[URL]"; $.getJSON(url, {f: "json"}, function() { alert("success"); }) .success(function() { alert("second success"); }) .error(function() { alert("error"); }) .complete(function() { alert("complete"); });}
I was wondering if someone can help me write some jQuery that would be executed after 1.8 seconds pass. Well what I want to be executed is all div tags to be shown. As$(document).ready(function() { ("div").show();});would show all div tags when the document is loaded.Is there a way I could do something like what I have written inpseudo-code$(document).wait("1800", function() { ("div").show();});
I have following code in Javascript. I m calling live handler using jquery and get responsein json format but I get following problem while getting json response:When I call tnSearchClick() function on button’s click at that time the handler will call usinggetJSON method of jQuery but the response will take some seconds of time to returns response so that after few seconds the callback function will call and response can be accessed from callback function but because of handler get some seconds to execute remaining code in tnSearchClick() function after handler call code get executed before callback unction(before resonse will come) The following code will be executed before callback function will call(before response will return from handler)
I have a function in which I manually send an argument which is the name of the ID calling on the function For example (this is placed in a simple onmouseover event within the DIV: rw_moveToTarget("The_ID_of_This_Div") And then the function looks like this:
The function is called from a child popup window which closes the child when called. The function works well however when the child window is closed the cursor on the parent window continues as if it is trying and load something (although nothing is being loaded). Do I need some sort of end function to close the function off after it is executed?
I've been looking all over for an explanation of this function declaration but cant find it. what it means to have a function with no name, just declared as this. When does it execute? How does it get called?
I'm playing with a modal Dialog of ericmartin (simplemodal) which I found at this url: [URL]
It's called "Confirm override". This function is called through a click on the button or on the link. Now I want to call this function onload I dont' have really a clue, how to manipulate the current script to make the correct changes.
Imho this is the code snippet, which calls the popup through a click.
jQuery(function ($) { $('#confirm-dialog input.confirm, #confirm-dialog a.confirm').click(function (e) { e.preventDefault(); // example of calling the confirm function
I have a bunch of jquery code that animates survey results. It starts by clicking on a css designed 'submit button' (see below). My question is to get the following, which works once the button is submitted, to activate instantly upon page load...for reference, here is what I am working with currently:
Code:
Then a css enabled 'pop up window' appears due to a CSS effect:
Code:
Question is: How do I do this without clicking on a button. Rather, have this work, as it does now, by page onload? It'd save me a ton of time and finally let me wrap up a project where the creator parted ways.
I know one might want to ask "Why does it have to activate on onload? Take my word, having a pop up with querystring makes all the difference for reasons I won't get into.
I need to execute a function after a link to a section within the same document has been clicked and the navigation has occurred. When using the onclick event handler the JS function is executed before the navigation occurs. I can't tie it to a window.onload event since the link only navigates within the already loaded document.
I'm not having any luck searching due to not knowing what keywords to use. I looked at an explanation of bubbling vs capturing, but that doesn't appear to be what I need.
I have this code which removes a class from an item on mouse out.
Code:
function mouseOut8( ) { $('.bar8') .removeClass("barover"); }
I would like to change this so that the class is removed from the item I have just moused out of instead of specifying the exact item. This is so I can use this function for multiple items. I tried replacing the '.bar8' with 'this' but it didn't work.
I have long html/CSS (no CMS or php, etc.) web pages. Some people run away when they see too much content on a page. So I hide the large lower section of the pages and have the user click anchor text to execute simple JS code to change the display from 'none' to 'block' or back to re-hide.
Code:
(BTW my research indicates that search engines do not know the difference between display='none' and normal content, or I would not be hiding content in the first place.)
Within this hidden content, I have anchor text to provide name handles
Code:
So users can click a link and go directly to that section. Within that link I include
Code:
So that works fine within a particular page. But when I want to link to an anchor on another page which is within this hidden content, the browser cannot display the anchor text because it is still hidden.
Is there a way to execute the JS code to change the DOM, changing the display to 'block' on the content of the new page?
I do not see how, because the new page isn't loaded yet, there is no DOM within the browser yet, so how can it be manipulated?
Of course if I was using php I could generate the code with the property set as desired. But for straight up html/CSS/JS pages is this possible?
I get the feeling I am missing something simple here, either a simple solution or the simple fact that this is just an inherent limitation of html.
I have been trying to work my way around this issue for some time now. I am trying to stop a marquee from scrolling as soon as the page start to load not after. I have been using this to pause the marquee with JavaScript but the command does not execute but after the page loads; after all the html loads.
With this code the marquee does stop but after the page loads completely so as the page loads the marquee start to scroll and then stops as soon as the page finishes loading but with the first image of the marquee have way out. I need to be able to load the marquee 100% stopped as the page loads so then I can use the buttons I placed to control the marquee.
My question is:
Is there ANY way to completely stop the marquee from scrolling as soon as the page loads??
how to scroll the marquee by click; meaning by every click of the mouse the marquee moves either left or right, would be even better. p.s: Noted that this code does NOT work in FF for some reason. The stop does not work and the buttons don't respond. why in FF they don't work but in GC and IE they do?
I have a javascript code which makes a word toggle links under it. For example: Before clicking on it it looks like this: Stories: then once its clicked on it looks like: Stories: story 1 story 2 story 3
How can I make it so when you click stories it creates that list and also goes to story 1. Here is the code I have: Code: <h2 style="margin-left : 25px;"><img src="/images/sort_ASC.gif" id="img_DegreeList5" alt="" /> <a href="javascript:toggleDegreeList(5);" style="color:#336699;">Teaching Tales</a></a></h2> <div id="DegreeList5" style="display:none;"> <ul><ul> <li><a href="teaching_tales1.php">Story 1</a></li> <li><a href="teaching_tales2.php">Story 2</a></li> </ul></ul> </div>
And here is the toggledegree script Code: <script type="text/javascript"> var currentDegreeList = null; function toggleDegreeList(which) { if(currentDegreeList) { document.getElementById('DegreeList'+currentDegreeList).style.display = 'none'; document.getElementById('img_DegreeList'+currentDegreeList).src = '/images/sort_ASC.gif'; } if(currentDegreeList != which) { document.getElementById('DegreeList'+which).style.display = 'block'; document.getElementById('img_DegreeList'+which).src = '/images/sort_DESC.gif'; currentDegreeList = which; } else { currentDegreeList = null; } } var submitted = false; function submitForm() { var val = (submitted) ? false : true; submitted = true; return val; } </script>
If you actually want to see the live page its here [URL].