Combining jQuery scripts
These are the jQuery features I want to use on my site, how do I consolidate them so I can minimize the number of .js files I call? Tabs http://stilbuero.de/jquery/tabs/ Accordion http://www.i-marco.nl/weblog/jquery-accordion-menu/ Table Sorter http://tablesorter.com/docs/ Show/Hide http://www.mredesign.com/demos/jquery-effects-1/ Autocomplete http://www.pengoworks.com/workshop/jquery/autocomplete.htm Tooltip http://www.codylindley.com/blogstuff/js/jtip/
[jQuery] problem with Effects/fadeIn in ie
when I run the sentence jQuery ( '# divId'). fadeIn ( "slow"); in ie disappears in the backgroud, the background is a PNG image, the style is for ie: background-image: none; filter: progid: DXImageTransform.Microsoft.AlphaImageLoader (src ='../ images2_FR/background.png ', sizingMethod =' scale '); the text in the div appeared normal. Ariel thanks ....
[jQuery] change speed of animation during runtime
Hi folks I got an animation that looks somewhat like this: $('#pointer').animate({ left: activeItem.accumulatedWidth + 'px' }, tempo, ' ' , function () {$(this).playShow(times-1)}) now I've added a beautiful ui.slider and want to give the user the possibility to speed up or slow down the animation while it is running.... has anyone done something similar before? thx sissi
[jQuery] Problem with adding EventListener
Hi, I have just started using JQuery. And so far, I have gotten some problems with adding events in the loading stage to a button. The following is my code <head> <script src='js/jquery.min.js'></script> <script type='text/javascript'> $(function(){ $("#msg_button")[0].addEventListener('click',show_msg,false) }); function show_msg() { alert("Nice to show you this") } </script> </head> <body> <div id='msg'></div> <button id='msg_button' name='msg_button' >Show Message</button> </body> So Here
[jQuery] datepicker z-index
I'm having trouble overriding the default z-index for the datepicker. Here's the code I have (minus some stuff that doesn't apply to this issue): $("#datefield").datepicker({ beforeShow: function() { $(this).css("position", "absolute"); $(this).css("z-index", "3000000000"); return {}; } }); I've also tried using zIndex instead of z-index since that's how javascript calls it. Any ideas? -- Adam "Do one thing, and do it well."
[jQuery] slideToggle content disappears in IE
I have this page at: http://www.hopecc.net/ministries/adult I use slideToggles to show and hide somecontent. The problem is that in IE only any content that is inside tags display properly while the slide is happening but when the slide completes the content disappears. It works fine in FF and Safari. I currently have the slideToggle changed to a toggle but like the slideToggle much better. The problem code: $("div.ClassDetail h3").click(function () { if ($(this).children("a").text() == "Show description"){
[jQuery] Selecting an element whose ID is in a variable
This has got to be a FAQ, but I can't see it in the FAQ so here goes, and apologies if it's a stupid question but I'm a relative newbie to jQuery: How can I select an element whose id is stored in a constructed string variable? What I mean is something like the following. In a document I've got <span> elements with IDs "1", "2", "3", etc, and these correspond to fieldset elements with IDs "part1", "part2", "part3", etc. The user clicks on a <span>, the code gets its ID, constructs the ID of the corresponding
[jQuery] Help with syntax
Hi everyone, I've been playing with jQuery a lot lately but my skills could use a lot of work. I recently made this small snippet of script to show and hide tablerows from a link that looks like this: <a href="1" class="ahref">1</a> this will show: <tr class=box1 box"> <td>etc</td> </tr> Javascript: $(function(){ $('.box').hide(); /* hide every tr with class box at the start */ $('.ahref',this).click(function () { var id = $(this).attr('href'); $('.box'+id).toggle();
[jQuery] Custom plugin
Hi, im trying to make a custom jquery plugin but i need some help. Here is the function that i am trying to do, but i dont want to repeat this a million times through out the website. $('#MyDiv').mouseover(function() { $('#MyDiv').animate({height: 100, width:100}, "medium"); $('#MyDiv').attr('src','Icons/MyDivImage1.png'); }).mouseout(function() { $('#MyDiv').animate({height: 80, width:80}, "medium"); $('#MyDiv').attr('src','Icons/MyDivImage2.png'); });
[jQuery] [tablesorter] nesting tables with zebra striping
I'm probably pushing tablesorter and treeview beyond what they were originally intended for, but I have nested tablesorter tables using the zebra striping, but the problem I encounter is that if the nested table lies within an "odd" row all of the cells of the nested table are overridden with the "odd" style and none of the rows stripe properly. Has anyone else attempted to nest tablesorter tables and encountered this issue before? Any Ideas as to why the outer table row's css is overriding the inner
[jQuery] Fix relative links script not working
Hi, I have a lot of documents that have a mix of absolute and relative links. I'm using the following code to add the full URL and make the links all absolute. It works for the links that are relative, but it also puts the full URL in front of the links that are already absolute, making them break. How can I edit this code to only add to the links that are relative and leave those that are absolute alone? Another thought I had was to first take out the domain, and then run the script for everything,
[jQuery] Problem with Lightbox
Hello, I'm using this Lightbox in my project: http://www.balupton.com/sandbox/jquery_lightbox/ I want to display the images as a group, so I use this code: <a href="link" rel="lightbox-group" title="title"><img src="image" /></a> But this is not working, it simply opens the Image. When I use this code every image opens correctly, but so I don't have the navigation link on my images. <a href="link" class="lightbox-enabled" onclick="$(this).lightbox({start:true,events:false}); return false;" title="title"><img
[jQuery] Exists
Hello, I have the following: if (subject == '---') { if(!$('label[for="Subject",class="Error"]').length) { $('#Subject').parent().after('<label for="Subject" generated="true" class="Error">Required field</label>'); } } I need to check if a label with for="Subject" and class="Error" exists: if(!$('label[for="Subject",class="Error"]').length) This is not working. What am I doing wrong? Thanks, Miguel
[jQuery] jcarousel lite: getting it to work with a grided li display
i have the following designs (uploaded files better than words); using jcarousel lite, i'm trying to achieve the gridded design and the carousel motion (left/right) i tried modifying the math, but it still calculates the length incorrectly and when i number the li to make sure that 1-6, 7-12, and 13-18 are the ones displayed, i also noted that it wasn't pulling them in that order. i would like to keep each li separate instead of nesting another ordered list within the li. is there a way to achieve
[jQuery] Empty
Hi, I have the following on a JQuery Code: $('<li class="DynamicList"></li>').appendTo('#Themes') .append(subject) .append('<br />') .append(levels) .append('<br />') How can I add .append(subject) .append('<br />') only if subject is not empty and .append(levels) .append('<br />') only if levels is not empty? Levels and Subject are declared as: var subject = [], levels = []; Thanks, Miguel
[jQuery] JQuery selector
Hi everyone, I have a question on JQuery selector. I want to add a class, last, into li elements where have <!-- This is the one --> comment next to it under different ul but have the same class "u". This is what I ended up with. However, it only selects "li" final two. $(".u > li:last-child").addClass("last"); <body> <div id="d1"> This is content </div> <ul class="u"> <li>1</li> <li>2</li> <li>final one</li> <!-- This is the one --> <ul class="l">
[jQuery] hide() not working when disabling CSS
Hi, I have <p class="jsoff">Please turn Javascript on to view the content. and $('p.jsoff').hide(); When I turn CSS off using the Web Developer Extension for Firefox and Javascript on, the message is somehow not hidden. I'm not sure if this is the problem, but Instead of style="display:none;", webdeveloper- inline-style="display:none;" is applied to the p. It works fine when CSS is on though. Appreciate your help. Thanks.
Get contents of div (from ajax result).
Is it possible to filter the results of an ajax request so it ONLY contains the contents of a div. So my script gets /example.htm which looks like: <body> <div id="head">This is the head</div> <div id="content">This is the content</div> </body> And this code will be stored inside ajaxRequest.responseText. So, is it possible to only keep the insides of the #content div? If anyone is curious, this is so my website degrades nicely, every page will have the full html. Many thanks!
[jQuery] Extending jQuery the OO way
For those interested in extending jQuery the OO way, I have posted an article on this subject here. http://santrajan.blogspot.com/2008/10/what-john-resig-did-not-tell-you.html
[jQuery] Validate Plugin - On Error?
I need to perform a custom action when it turns invalid. Currently, I have this: success: function(label) { label.html("good").parent('div').removeClass('bad').addClass('good'); }, Ideally, I would just do: failure: function(label) { // set as text for IE label.html("bad").parent('div').removeClass('good').addClass('bad'); } But that doesn't work. How can I perform this action when the script detects that something is amiss?
[jQuery] Help in Autocomplete
I am using firebug to debug my js and i am getting the following error. value.replace is not a function http://localhost/rentalphase2/jquery.autocomplete.js Line 409 Firebug is showing my return from the script as letssene letssen letssenee letsseneee letsseneeee Adding New Customers which implies a \n between the two. So can you tell me what i am doing wrong Waiting in anitcipation, Thanx Aditya.
[jQuery] Hover not work properly when moving mouse fast...
http://docs.jquery.com/Events/mouseout Even in the example it does not work correct.. for example make some circles with the mouse on mouseout.. it will keep adding numbers. Also with mousenter, move it fast and the numbers will go up with big amounts. :( How to fix this, i can't use mouseout cause it will fire also with the child elements.
selecting one row in dynamic table
Hey, i have a table where I need the elements of one row only. Let's say I have a table where the rows are dynamically made by php: <tr> <td><input name="balance" type="text" /></td> <td><input name="interest_rate" type="text" /></td> <td><input name="term" type="text" /></td> <td><input name="payment" type="text" /></td> <td name="missing_type">1</td> <td>1</td> <td>1</td> <td>1</td> </tr> This will repeat for however many there are in the array. I want change the background
[jQuery] SuperFish: IE7 moving unrelated divs
Alright. This is a wierd one, I will try to explain clearly. I have one div, that has my masthead stuff in it. header image, contact info, that sort of thing. Then under that (not in), I have a nav div that I have placed the superfish stuff in. In other browsers this works swimmingly (pun intended). But IE7 forces a piece of the masthead div over like it is reseting its padding and moving it to the left. Commenting out the js files makes this go away, so I don't think this CSS related. I could be
[jQuery] jQuery.getScript problems on IE 7
My IE 7 and 6 get a error while load protoculous-effects-shrinkvars.js by jQuery.getScript method. IE popup this error message: Line: 310750026 Char: 72353 Error: 'null' is null or not an object Code: 0 How to fix it using jQuery.getScript? Prototype Framework doesn't like jQuery? PS.: In FF work very well.
[jQuery] Add label
Hello, I need to check if an input, #Message, value is empty. If it is I need to add the following after it: <label for="Message" generated="true" class="Welcome">Welcome Text</ label> How can I do this? Thanks, Miguel
[jQuery] Selector
Hello, I have the following: levels = $('input:checked + label'). ... Can I select only the inputs checked but which name is "Level"? Thanks, Miguel
[jQuery] Don't focus a readonly field
Hi all, I have a table that I will usually want to focus the first input box in the first column in the last row. Something like this: <table> <tbody> <tr> ... </tr> <tr> <td> <input> <-- selects this one <input type="hidden"> </td> <td> <input> </td> </tr> </tbody> </table> And I use this to do that part: $('tbody>tr:last-child>td:first-child>input').focus().select(); The problem is, in some cases, that input field is readonly, so I don't want to select it. I want to select the input in the
[jQuery] Jcrop minSize
I'm using Jcrop to select a 1:1 ratio non-resible area. The idea is to move the area but not to resize it. To do this I use the following code: $('<img class="currentimage" src="'myimage.jpg'" width="400" height="480" />').Jcrop({ setSelect: [ 0, 0, 400, 400 ], aspectRatio: 1, minSize: [400,400], maxSize: [400,400] }); However with this code it is still resizable. Am I doing something wrong???
Help with this.each(function(){})
I'm building a plugin and am trying to get the standard 'return this.each' function to work, but to no avail. I know I must be missing something stupid. Can anyone see what I'm doing wrong? $.fn.randomContent = function(options){ var defaults = { // Set the path to your XML file xmlPath: "chuck.xml", // Define the class name that will recieve the random content className: "chuck", // Specify the node name in the XML file that contains the content
[jQuery] AJAX post, dynamic data field names
Let's say we have the following piece of code: $.post("/scripts/admin.course.php", { elemname: value1, elemname2: value2 } , function(data){} ); Is there a way to dynamically set the field name? e.g. var elemname = 'newname'; $.post("/scripts/admin.course.php", { elemname: value1, elemname2: value2 } , function(data){} ); Then the data that get's posted would be: array( 'newname' => 'value1', 'elemname2' => 'value2', ) TIA
text formatting issue
I have a bunch of pages on my movable type site that I want to use the pager plugin on. Now, these pages are formatted with two break tags after each line, and no tags wrapping around the lines. So my idea was to replace every other break tag with an opening div, and then every break tag immediately preceding those divs with a closing div tag... an inelegant solution that produces some ugly code but it seems to work. Almost. It's outputting the divs formatted without a closing tag, which is compliant
[jQuery] jQuery Cycle - onBefore? onAfter?
I am using this plugin for my portfolio site. I use it quite often, but am stumped and hoping someone can help. Each slide is a div which contains an image + a reflection (using reflection.js - it wraps the image and its reflection in a div), and then a div with a description. Here is the URL- http://maryahayne.com/web.htm I need the description div to be higher in the stacking order and float over the reflection. In IE6 and 7 (only - it works in all others), this last div, called '.desc', goes under
[jQuery] jquery load() doesn'y work on IE7
Hi, I have a problem with the load() function to load an html file on a div. It works in every browser (even on IE6), but not in IE7. Somebody knows a fix? Thanks
[jQuery] ajax in included content by ajax
hello I have some small problem and I don't know how to fix it. I load content using this simple function function loadContent(id) { $("#content").load("controller.php?module="+id+""); } into <div id="content">here goes data</div> but if data contains some part of html and js code, when I want to use jquery (ajax query) it's not working! I don't know why and I will be very greatfull if someone could help me. greets
[jQuery] jquery tabs on ajaxed content
I have this markup structure: <div id="ajax_content"> <h3>Some Title</h3> <span class="phone_holder>...some content...</span> <span class="phone_holder>...some content...</span> .... more spans like this (around 100, depends on particular ajax page I am loading, might change due to the content changes) <span class="phone_holder>...some content...</span> </div> So, I need to make tabs out of this structure. Something like that: <div id="ajax_content"> <h3>Some Title</h3> <ul class="ui_tabs"> <li class="ui_tab">
[jQuery] Modify nested, un-ordered list
I have a nested, un-ordered list, representing a table-of-contents, that I want to modify. Specifically, increase or decrease the indent level of an entry. I have tried to use the family of functions append, prepend, before, after and warp, but I am not successful yet, and I hope the group can show me an efficient and practical way to get this done using jQuery. For example, take this list: <ul> <li>Entry One</li> <li>Entry Two <ul> <li>Entry Three</li> <li>Entry
[jQuery] jcarousel troubles
jquery-1.2.6 jcarousel-0.2.3 Firefox-2.0.0.14 I'm trying to get jcarousel working and have run out of ideas. Perhaps someone can toss me a clue of where else to look. html: <ul id="gallery" class="jcarousel-skin-cb"> <li><img src="/gallery/01.jpg" alt="" width="150" height="150" /></ li> <li><img src="/gallery/02.jpg" alt="" width="150" height="150" /></ li> <li><img src="/gallery/03.jpg" alt="" width="150" height="150" /></ li> <li><img src="/gallery/04.jpg" alt="" width="150" height="150"
[jQuery] validation - how do I validate a hidden value against a radio box selection?
Hey All, Looking for some help... I have a form with 2 radio buttons. If one is selected, than the user has to make another selection which puts data into a hidden field on the form. I the second button is selected, no data is necessary in the hidden field. I can't figure out the best way to do this using the "rules" section of the validate method... any help would be appreciated, thanks.
[jQuery] Background image position?!
I have a pop up div on our sites home page. The content changes based on the menu link the user clicked. A triangle tab should then move to reside between the clicked menu item and the popUp. This works fine of the dev server, but not on our live server (http://www.pro-bel.co.uk/) We've checked: The jQuery.js files and tried re-uploading the latest version, both compact and normal. My scripts are the same on both servers. Both sites are on the same server though, just a difference domain?! To see
Next Page