Correctly adding an element
Hi to all. I would like somebody to tell me wich is the correct way to add an element to another, and then give the added element a class ?? $("firstElement").add("elementAdded").addClass("classForTheAddedElement"); is adding the class to the "firstElement". Any help ?? Thanks in advance
Loading classes after ajax call
Hi all, First time using jquery and so far I love it. But I am having a bit of an issue and I was hoping someone could point me in right direction. I am using the tablesorter plugin for jquery and it works fine. But my issue is I am loading the data using ajax, and I cant seem to get my <tr> to trigger jquery. if I fill out the data by hand in html it works fine but when I load it with ajax nothing happens. I mean I can see the data and the tablesorter works. Attach is my javascript, hopefully someone
gt and lt selectors algorithm (speed)
Hello, I am making pagination and have a function goToPage(pagenum). I'm curious if anyone knows what algorithm the gt and lt selectors use because I want to know if using them is not just more elegant code but also better. Compare the two snippets: The HTML looks something like this: <div id="row_wrapper_0" class="search_result_row_wrapper">(ROW CONTENTS)</div> <div id="row_wrapper_1" class="search_result_row_wrapper">(ROW CONTENTS)</div> <div id="row_wrapper_2" class="search_result_row_wrapper">(ROW
Strange order behavior
Hey all, I have a good lot of experience with javascript and jQuery but I am seeing something very strange today and I can't figure out what's going on. I've stripped down my code to the point where there's basically nothing going except for this weirdness. Here's my code: function sortBy(column, direction) { $("#search_result_container #scrim_loader").show(); for (var i = 0; i < 999999999; i++) { var y = i; } //$("#search_result_container #scrim_loader").hide(); } notice
Jquery Dialog
I am using Jquery Dialog and it works fine. however for a split second when the pages loads behind my normal page (That is all setup via CSS absolute value) there is a flicker of the dialog before it is hidden. This looks a bit unprofessional. is there a way to stop it?
JQuery problem
Hi All, this is the error i get in superfish menu in joomla, Also i only get this in the "done, but with errors" bit in the bottom of IE "object doesnt support this method" the line it mentions is the fourth line down on this. jQuery.noConflict(); jQuery(function($){ $("ul.sf-menu").superfish({hoverClass:'sfHover', pathClass:'active', pathLevels:0, delay:800, animation: {opacity:'show'}, speed:'def', autoArrows:0, dropShadows:1}) }); jQuery(window).load( function() {jQuery("ul.sf- menu").superfish_width_mod({
Performance Tweaking
So I read that caching selectors is a best practice, and I'm trying to update my script accordingly. //This is BAD $('#item li').css ('color', '#123456'); $('#item li').html ('hello'); $('#item li').css ('background-color', '#ffffff'); //This is GOOD var item = $('#item li'); item.css ('color', '#123456'); item.html ('hello'); item.css ('background-color', '#ffffff'); My question is what if I have a lot of children to access, will caching improve performance in this case: //Method #1
When element becomes visible jquery?
Hey guys Just wondering if there is a way to get some code to run when an element becomes visible or invisible... Cheers Anthony
Match links to more than one possible domain
Here's my situation: I'd like to have links to my organization's sites open in the current window, but links to other sites open in a new window. The tricky part is that not all of our sites are on the same (or even similar) domains. This works just fine for matching foo.org: $(".article a[href*='http:']").not("[href*=foo.org']").attr('target','_blank').addClass('external'); I'd like to widen this so that links to foo.org, bar.net and whatever,com all open in the current window. It seems like everything
getJSON nothing happens
Hello, I have test the following code: $.getJSON("api.php", function(data){ alert(data.state); } ); the API contents the following: new Object({ 'state' : 'starting' }) in firebug i see, that the file api.php is loaded and the content is the right. But i dont get an alert with the state starting. i have test a lot...header content type text/javascript application/json etc. What is the error? Thank you
using .load() with script tags doesn't work
Hello everybody, I'm developing this website: http://www.wpbrainiac.com/demos/radioimperial/ But now I have a problem... Just on IE it's not loaded right... If i put any <script> tag on my page to load, even if it's an HTML comment (<!-- <script> ... -->), the jQuery loads, and the jQuery response says SUCCESS, but doesn't show like needs to show on the screen :( If i delete the script tag, it shows perfect on the whole IEs (ie 6, ie 7 and ie 8) Does anybody have any idea what is happening? what
wrap() and wrapAll() methods are not working as expected
Here is my code.. I am trying to wrap TBODY in DIV to have scroll for the tbody.. but it is not working as I am expected. Please help me out / gimme the reason why it is not working / have anybody experienced the same problem? <!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("table.tableda > tbody").wrapAll("<div style='border: 2px solid #cc0000; overflow-y:scroll; height:100px;'></div>");
Problem using content slider within content tabs
I have been trying to implement a content slider within a content tab box without much success - you can see it here: http://www.dave-tyler.co.uk/test/ It starts off ok, then craps out - if anyone has any ideas or can notice what's going wrong i would be really grateful. Thanks
Catching JavaScript exceptions in jQuery code.
Hi all, I'm using $.ajaxStart and $.ajaxStop events for showing a "loading" gif to the user, when ajax call is going on. In my $.ajax success callback, if there is some error in JavaScript code, code execution stops abruptly and the "loading" animation never gets hidden($.ajaxStop never gets fired). I tried using $(window).error., still I'm not able to catch the exception. Looks like jQuery is suppressing the error. Can anyone explain how to deal with unhandled JavaScript exceptions? Regards, Krishna,
Binding the $(document).ready and everything inside of dynamically loaded page
Hi JQuery Gurus, I am sure this question has been raised and answered before, but I can't seem to find an answer that works for me. I hope I will get an exact response here. Here's my issue - I have my index.html that has its own $(document).ready method and everything pretty much works within it. I am trying to dynamically load a page to replace part of index.html (let' say the #inner_content ID) - function loadContent() { $('#inner_content').load("XYZ.html#inner_content",'',showNewContent);
resizing sidebar and iframe with jquery
I am trying to get something to work where I have a sidebar on the left that can be resized with jquery. On the right I have an iframe. When the sidebar resizes I want to resize the iframe. I have not had any luck with this and the iframe ends up with the sidebar on top of it instead of on the side. ======================================== <script src="/javascripts/prototype.js?1259104156" type="text/javascript"></script> <script src="/javascripts/effects.js?1259104156" type="text/javascript"></script>
how use wrap instead replace?
i have great function for find word and replace with tags <$(function(){ $(".title h1").html(function(i,text){ return text.replace(/\w+\s/, function(match){ return '<span>' + match + '</span>'; }); }); }); but i can't use this with cufon font replace. Without Cufon.now() - all works fine (first word black all others blue) But if place Cufon.now() before </body> i get: <cufon style="width: 50px; height: 28px;" alt="We " class="cufon cufon- canvas"> where in cufon after < is black
get return object not DOM
alert($("ul li").get(0)); This alert show this, literally: [object] This [object] will not accept any DOM methods like addClass, etc... Have I goofed the syntax?
file type validation
hi all i have multiple <input type="file"> to upload files and i want to validate file size limit and file extension using jquery so is there anyone who can help me i have tried jquery based on id but i want jquery on the bases on $(":file") so that it validates all of this and after click on upload button it uploads the image.
hasClass Problem
Hey, I have a problem with hasClass: I do the following if($("input#edit-pass").hasClass("error")) $("#register-box").show(); else if($("input#edit-pass-pass").hasClass("error")) $("#login-box").show(); The Problem is, hasClass does not make any differences between "edit-pass" and "edit-pass-pass". For hasClass this two different classes are the same. Any ideas? Thanks Jan
Problem with load event
I have simple document: <script> $(document).load(function(){ alert('Document loaded')} ); $(document).ready(function(){ alert('Document ready')} ); $(document).live('load', function(){ alert('Document loaded (live)')} ); </script> But from 3 attached events on page load fired only once - $(document).ready. I even can't imagine why :( . Test page: http://ru.bir.ru/_/svg/jquery-test.htm I've tested it in FireFox 3.6 and Google Chrome 5.0.322.2 dev. Any suggestion?
Amazon Like Flyout menu
Can someone show how to make a flyout menu like the one in amazon (see attachment). Thx OOzy
why this event repeat
Hi The 2nd time I click, the function repeats twice, the 3rd time I click, the function repeats thrice... like a loop depends on my clicks. what is the problem, is it a bug of jquery or a bug of mine. Thanks in advance. Cheers <!--============--> <head> <script src="jQuery.js" type="text/javascript"></script> <script> var i=1; $(document).ready(function() { $('li').click(function() { alert('this:'+i); $('li').click(function(){ i++; alert(i);
xmlHttpRequest abort() does not close the connection in Internet Explorer
In Internet Explorer when I call the abort method on my active xmlHttpRequest requests, IE does not close the connections. So... if I have two or more connections running, I have to wait until they complete before I am able to navigate to another page. FF does not have this issue. Is there any way to close these connections with abort() in IE???? This is extremely frustrating. Thank you! Bryan
Sliding Doors Images (Or whatever one call this)
Hi, Going to skip to the chase and just ask...any pointers on how one do this in jQuery (I use jQueryTools most the time and fall back on jQuery when out of options) http://preview.zcool.com.cn/code/new_code/002/ And for the love of Darwin...what do one call that?
Assign multiple navis (scrollabels) to other scrollables
Please be have patience with a newbie. Ok, i hope i can explain it. I have a scrollable vertical that has 4 scrollable insite. This 4 scrollables are controlled by thumnails that are in another scrollable. So every one off this 4 scrollable has a navi-scrollable. First my code: // main vertical scroll $("#mainscroll").scrollable({ // basic settings vertical: true, size: 1, clickable: false, // up/down keys will always control this scrollable keyboard: 'static', // assign
Selecting problems else if
Hi, i'm relative new to jQuery and for me the hardest part is allways to get the right elements. Ok, i have a form and in this form i have a lable (id="hint") after sending the form above the form a div shows up. If everything is ok the div looks like that <div id="results"><p></p></div> if theres an error <div id="results"><p class="error"></p></div> I want to hide the <lable id="hint"> and the form if there is <div id="results"><p> If there is <div id="results"><p class="error"> i just want to
Setting up a link from var
Hey: I am creating an image gallery and need some help with how to write this in jquery. Would like to get the 'src' from a thumbnail and pass it into a var on hover. The reason is that i am loading a tooltip as an overlay ontop of the thumbnail(blocking a direct link), so i have to pass the url(src) to the tooltip and load the image from there. here is the code: var url; $("#dyna img").hover(function(){ url = $(this).attr("title"); },function(){ url = $(this).attr("title");
trouble selecting all readOnly attributes
I'm trying to color all the readOnly elements grey: In jquery 1.2.6, this worked: $('input[@readOnly]').css('background-color','#D8D8D8').css('color','#686868'); $('select[@readOnly]').css('background-color','#D8D8D8').css('color','#686868'); $('textarea[@readOnly]').css('background-color','#D8D8D8').css('color','#686868'); BUT in jquery 1.4.1 that breaks. So, although this works $("input:text[@readonly]").css('background-color','#D8D8D8').css('color','#686868'); how do I now target the textareas
How do I make hyperlinks act as the submit button of a form as well as the value of the name value pair?
Need the three "Options" to be hyperlinks that submit the "choice" form. When submitted, I would like the value to be the text of the option selected (i.e. value=Option1, Option2 orOption3) and all three to have the same name. (i.e. name = Options) How do I make the 3 options inputs and submit on click? Any help is appreciated. <form action="cgi.exe" method=POST name="choice"> <tbody> <tr> <td>Option1</td>
Adding ease effect - am I doing it right?
I installed the ease script on my website it but it doesn't seem to work.. The code I'm using is below. Have I made a mistake? <script type="text/javascript"> $(document).ready(function(){ $("#myController").jFlow({ slides: "#mySlides", controller: ".jFlowControl", // must be class, use . sign slideWrapper : "#jFlowSlide", // must be id, use # sign selectedWrapper: "jFlowSelected", // just pure text, no sign easing: "easeOutBounce", duration: 'slow', width: "100%", height:
Events attached to <option> elements not recognized in IE, pls help!
Hi! The following code is a minimal example that works perfectly in FF but not in IE. I need to obtain the value associated to an option when the mouse pointer is over that option. Any chance to get this under IE? I'm new in jQuery development, please help! <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title></title> <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> <script type="text/javascript">
Memory leak in html() function
Greetings from Australia. re: code snippet below... I do not understand why function aa() still exists at (line-Z). After $('#d3').html() is loaded into #d1 at (line-Y), why does JQuery NOT free memory consumed by aa() ? What are the consequences of calling Control.init() 200 times ? Thanks in advance Ron B var Control = { init : function() { alert(typeof aa); // (line-X) aa() is undefined (due to it being commented out) var s = $('#d2').html().replace(/\/\//g,
AJAX loaded links unrecognized by jQuery
The code below loads a page that has html links on it into a div but jQuery can't "see" the AJAX loaded links. Thanks for any help. $(document).ready(function(){ $("#cats a").click(function(event){ catID=this.id $.ajax({ url: 'fetchRests.php?catID='+catID, success: function(response) { $("#rests").html(response); }, error: function(xhr) { alert('Error! Status = ' + xhr.status); }, });
Loading message while a page is loading?
Hello my friends ! Is it possible to "Only" display a loading message and hide all page's elements and graphics until the page is fully loaded. then loading message disappear and the content fades in!? I can't think of it's logic more than this one logic which doesn't work properly ! <script type="text/javascript>" $(function(){ // this is a tab for example! $(".HomeTab").click(function(){ $("#LoadingMsg").show(1000); $("body").load('home.php', function(){ $("#LoadingMsg").hide(1000); }); }); });
Can jQuery do this?
Check out this link:http://www.joomlajunkie.com/demo/themelets/beta/creativa You see how every page opens with a "ta-da" type of entrance. It spans horizontally, then vertically, and fades in. Does anyone know how to achieve this?
Cannot get the changed value ( aspx/jQuery/C# )
Alright this is the jQuery code I am using, followed by the C# code used to change the lastPoll value. $.ajaxSetup ( { cache: false } ); var lastPoll = null; function Poll2() { $("#scripts").load("Ajax/ScriptToCheckTheFile.aspx", { projectId: $("#projectId").val(), lang: ($("#projectId").val().charAt(0) == "E") ? "eng" : "fra", lastPoll: lastPoll, projectName: $("#projectId option:selected").text() }, function(result) { alert(lastPoll); } ); } MethodInfo WritableMethod; MethodInfo
jquery form submit problem IE8
Hi everyone, I'm new to this form and quite new to jquery as well. I've recently built this form on a website using the jquery ajax function. Everything works just fine in firefox and opera. But when I press the submit button in IE8 the form gets submited anyway. It seems like IE8 doesn't get the "return false" statement. Here is the form html. <form action="" name="contact" id="contact"> <label for="voornaam" id="voornaam_label">Voornaam:</label> <input type="text" name="voornaam" id="voornaam"
Improving on a photo resize/thumbnail creator plug-in...
Ok, below is the modified code for a plugin I obtained from www.webmotionuk.com. Their version took a fixed width image and allows the user to create a fixed width crop window while previewing the cropped image in another div. I've made a few adjustments to allow the image to be any h & w and maintain the scale of the crop. This will allow a user to upload a photo, have it resize automatically, then create a 160x160 image for their profile. The problem I'm having is twofold: Restricting the footprint
Slide div left and right using mouse (with easing)
Does anyone know if there's a jQuery plugin that can achieve the sliding div effect as seen on this page: http://www.designcorporation.co.uk/creative_detail/creative/design/102/1/imgpan/ I've done a LOT of searching and can't find anything that does it apart from the mootools plugin that powers the above effect - I would prefer to use jQuery if possible. Alternatively, would this be fairly easy to code and could anyone point me in the right direction? Thanks
Next Page