jQuery 1.4.4 + meta characters in selectors = broken?
Until v1.4.4, I was able to use the following selector: jQuery("input[type=checkbox][name='entry[id=>assignedToUsers][]']") to select the following checkbox element: <input type="checkbox" name="entry[id=>assignedToUsers][]"> This was clearly in violation of jQuery's selector requirements, but it worked. I even tried encoding the > as >, but this introduces the ";" character into the selector. The jQuery Documentation has the following note: If you wish to use any of the meta-characters ( #;&,.+*~':"!^$[]()=>|/@
Can't open only one element with "dialog" function
Hello everyone and please forgive me in advance if I leave any details out as this is my first post here: I have a problem using dialog JQ command. More specifically, I want the button called "Edit" (line 7 below) to open only 1 window as opposed to all behind each other. Below is some of the code I use right now and a short description of what happens with the codde. Thank you in advance for reading! <!-- C# and HTML code here--> <table> <tbody> <% foreach (var item in Model) { %> <tr>
svg transparency feature detection
1. safari does not preserve transparency with SVGs in object, embed, or iframe tags 2. safari does preserve transparency with SVGs in image tags What I mean by "preserve transparency" is if the SVG with a red circle in an object tag is placed inside a div tag with a black background color, only the SVG will have a white background. The circle will be red but inside a white square inside a black div... I need to detect if the object tag is preserving transparency. If it does not preserve transparency
dialog not centered horizontally in chrome with v1.8.6
To reproduce <div id="popupcontainer"> Test stuff </div> and $("#popupcontainer").dialog(); The dialog is shown centered vertically, but not horizontally (appears on the left) in Chrome 7.0.517.44. Works fine in IE and FF.
Need help with a slider
I have a practice site where I've been playing around with some jquery. Check it out here: pourite.com It functions ok and if you click a button, the image slides down as it should. How can I make it so that if the image is down already and you click another button, that respective image will slide down too instead of the previous one sliding up first Here's my script: $(function(){ $('#menu-container').hide(); $('#box1').hide(); $('#button1').click(function(){ $('#menu-container, #box1').slideToggle('medium');
Other Mobile frameworks ?
I am new on mobile apps.Can any one tell me what are the other frameworks available for mobile apps?
Using jQuery Mobile with Web-SQL and dynamicly generated content
Hi, i've started to convert an old webapp to jQuery mobiel today and it's going pretty good but i have som questions about how to best use jQuery Mobile combined with the webkit Web-SQL database. This webapp is supposed to be a offline capable iphone app, so i'm forced to use only JS/HTML. My page works like this: on my startpage i append a list of links generated from the DB to the main div[data-role=content]. and when you press one of the links i want to display the data on a new page. What i did
showing 10 numbers one after the other
Hello, new to jquery here... I have to "fadeIn" 10 numbers, one after the other. Do i have to nest all the "fadeIn" in my code? Like: $('#number1').fadeIn(400, function() { $('#number2').fadeIn(400, function() { $('#number3').fadeIn(400, function() { $('#number4').fadeIn(400, function() { ... until 10 Or is there antoher way to do it. I thought with plain JS, calling a function with a setInterval, but I'm afraid then I'd lose the sequence of effects, because after the last fadeIn
Code Efficiency
Hey! Is there anyone who could help me make this code more efficient? $("a.more_info").toggle(function(){ var itemid = $(this).parent().parent().parent().parent().attr('id'); var itemid_hash = "#" + itemid + " .details_exp"; var itemid_tog_more = "#" + itemid + " a.more_info"; $(itemid_tog_more).addClass("less_info").removeClass("more_info"); $(itemid_hash).fadeIn(); }, function () { var itemid = $(this).parent().parent().parent().parent().attr('id'); var
How do I stop the blink??
The following code is meant to highlight the LI that the user is in within a form: $("input,textarea,select").focus(function () { $(this).parents("li").addClass("focus"); }); $("input,textarea,select").blur(function () { $(this).parents("li").removeClass("focus"); });So far this is fitting the needs, except that when I have multiple radio buttons within an LI it blinks each time I click on a different radio button. How do I fix this so that it can 'remember' if
Problem with .css() - invalid object initializer
I have a simple css modification to make and have run into an error. It appears to be correct syntax to me, what is the cause of the error "invalid object initializer": On this line: jQuery("span.slideNav-title", node).css({float:'left',marginRight:'0',marginLeft,'4px'}); Thanks.
how remove an element from an element
<li><input type="checkbox" name="test" />test</li> how can I remove the input field from the list? I want to end like this: <li><input type="checkbox" name="test" />test</li> I thought the following, but does not work: $('li').remove('input');
Page Slide Plugin links issue
Hi guys :) Sorry to bother you, but I kinda need some help, because I'm stuck. I'm trying to use Scott's Page Slider Plugin. But I've stumbled upon a few problems. I did managed to take care of some, but I still have a biggie here, If you've clicked on "link A" the page slides. But when it is slided, nothing happens when you click again on link A or link B /which is with the same slide-left class/. I need when link A is clicked, when you click on any other link /link B for example/ to open it's
how to expand a collapsible fieldset when user hit tab button from keyboard?
Hi, By using this tutorial Stylish Collapsible Fieldset using CSS3 and JQuery, I have created asp.net web form with collapsible fieldsets. When this web page/form loads all the fieldsets at that time they are collapsed/closed but when user clicks on any legend the fieldset becomes expand/open. Now I want to add another feature that when user finishes entering data in the controls of first fieldset and he/she wants to move to the very next fieldset. Then he/she (currently in the last control (that
Need help populating dynamically created input element values using datepicker and .live event handler.
I have a table with a date field in each row: <input class='"datepicker" id="dp_XXXXX" value=""/> The table, and the input id element, are dynamically created from database records and I use jQuery live to initialize the datepicker for each field, like so: $('.datepicker').live('click', function() { $(".datepicker" ).datepicker(); });The idea is that when I click in the input field, the datepicker pops up and allows the user to input a date. While the date shows in the input field
Doing some magic with JQuery
Hello all, I have this problem that I can't solve... I have two links. I want to show a text when none of them is hover, and then, when the mouse is over one of the links, fade out the current text and fade in the related one. The thing is, when doing it slowly and in order it works fine. But if you pass the mouse over both links quickly you can get the effect that both text are activated. I also tried the "if :animated then stop()" but I couldn't make it work. I have tried many things, unsuccessfully.
Help with .change (show a field on a <select> change)
First off, any help would be greatly appreciated. I'm sure some experts around here wouldn't have a problem at all! Below is the relative code: <select id="cash_or_check"> <option value="cash" SELECTED>Cash</option> <option value="check">Check</option> </select> <input type="text" id="check_number" name="check_number" size="10" /> $(document).ready(function(){ $('#check_number').hide(); }); $('#cash_or_check').change(function() { $('#check_number').show(); }); All I am attempting
Easy Question: Mouse over one class and Activate the :hover on another class
Upon mousing over one class, I would like another class's :hover css rule to be activated. My problem is in my main menu. When the mouse transitions from the main menu link to the drop down menu, the main link's :hover rules are deactivated. All I'm trying to do is retain that :hover state on the main link while the user's mouse navigates through my mega menu. This way the user doesn't forget which main link on the menu he/she is navigating under. Here's my url: http://72.32.101.216/ A good
Conflicts Between Two Widgets
I have a page that contains two JQuery widgets, Accordian and Dialog. The Accordian was put in by a previous developer. I am adding the Dialog widget but noticed that if I set the .ui-widget-content style it affects the Accordian widget. Our stylesheet has no setting for .ui-widget-content but uses other styles to change how it looks. I can remove the style from the stylesheet for .ui-widget-content but then I lose the background color for the dialog. How can I set the .ui-widget-content style and
removing div
Hi guys, just one question.I want to remove the div within ready function. I'm using $("noJS").remove(); script, but it only hides the div (when I check the site's code, that div is still there). Please, any ideas? Uros
AJAX to an array question
Im a fairly new user of jquery but have been doing php, mysql and basic javascript for a while. What im trying to accomplish is this: I have a site that processes vast amounts of financial data and then displays the results for the user. There are about 5000 items that need to processed in this way. I originally did it in a single php script which took foreever to execute and with no real indication to the user as to what was going on. So i decided to try processing each item individually by calling
dialogs question
ok so one of the things that i would like to know is that will the jquery mobile dialogs have a iframe support. i know it might be lame to have an iframe dialog on a mobile device but i think that it will help in more ways than one.
jquery cycle image problems
The issue that I'm having is that the images in my slideshows occasionally downsize to a thumbnail size as moving through images with next or prev button. Anyone have an idea whats going on? Here is the site http://www.katiesoule.com/portfolio.html <!-- include jQuery library --> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <!-- include Cycle plugin --> <script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>
Can call a jquery function on onclick() of <a> tag ?
Can i call a jquery function on onclick() function of <a> tag
Validate plugin nog working in IE8
I have a form using the validation plugin and it's working great in FF and Safari but not in IE8. Can anyone tell me what's wrong with this code: jQuery(document).ready(function($) { // ajax submit form var $form = $("#contact-form"); var $sending = $("#msg-senging"); var $success = $("#msg-success"); var $errormsg = $("#msg-err"); // validate form $form.validate({ onfocusout: false, rules: { contact_form_name: {
Dropdown navigation, stay rollovered
Hello! I am new at jQuery! I am using a simple dropdown navigation script, [ http://fridaycode.net/demos/simple-drop-down-menu-with-css-and-jquery/ ] but as you see, when you rollover the sub links, the mother link "rollover" is dissapearing. See the attachment files for better understanding ;D ... so, is it possible to hold the hover state of the mother link when the mouse is going down for the submenus ?
cluetip shadow problem IE8
Very nice plugin, however I'm having a problem in IE8 whereby the dropshadow is shown in front of the cluetip - same code works OK in Chrome. Of course switching dropshadow off resolves it, but I wonder if there is a workaround - I did search here but didn't find any similar reports.
Problem with my "switch case"
Hello, <form> <select size="1" name="categories" class="texte"> <option value="0">-- catégories --</option> <option value="1">lion</option> <option value="2">butterfly</option> </select> <div id="options"> <p class="lion" style="display: none;"> <input type="text" size="8" value="lion"/> </p> <p class="butterfly" style="display: none;"> <input type="text" size="8" value="butterfly"/> </p> </div> </form> $(document).ready(function(){ $("select[name='categories']").change(function(){
Increment ID of selected cloned elements by one
Hi i have following code: <input type="button" name="addNew" id="addNew" value="Add New Activity" /> <table border="1" class="likertBorder" cellpadding="2" id="actTbl" > <tr class="likertBorder responseRow" id="actRow"> <td class="likertBorder" valign="middle" align="center"> <select id="SPORT1" name="SPORT1" onchange="display_sports_followup();" onblur="display_sports_followup();"> <option value="">-- Select Activity --</option>
jQuery Media and UI dialog issues
I have a video on my page that is being renedered using the jQuery media plug-in. This works great until I open a dialog box on the same page. When I do this the video is playing above the dialog box. I have spent several hours searching for a way around this and have found several post saying to use either wmode transpartent or opaque. I have tried both and nothing is working. I don't know if this makes a differance but the player and its controlls are under the dialog, it is the actaul video
slide then fade in
hi, I am fairly new to jquery and I have to build an animation where I have 5 different divs, which on rollover slidedown and display some text that fades in. On rollout, the text fades out and the div slides up. This way only one div could open at a time. Any help would be greatly appreciated thanks
Expand/contract based on height of content
Hi all, I need to amend a small script that creates tabbed <div>s with content that varies in height. At the moment from what I can gather the boxes are all given the same maximum height based on the tallest content which can vary dramatically. Any help will be appreciated! Here is the script... function createProductTabs() { var maxHeight = 0; var $tabs = $('<ul id="product-tabs" />'); var $details = $('#product-details'); $details.find('h2').each(function() { $this = $(this); $('<li />') .append($('<a
dialog close button only appears on hover
I'm using version 1.8.6, with the "Lightness" theme, which I have not modified. I put a dialog on the page, and the close button ("X" in the upper right hand corner, in the title bar) does not show up. If I hover over the spot where it should be, I get a white square, which does close the dialog when I click it. The dialog is displaying exactly as desired otherwise. Is there something I need to do to have this always show up? Or am I not using the dialog correctly? Below is the code I'm using to
Different behaviour since v1.4.4
Hi, In a very simple JQuery example I use the following code: $('#master_sidebarNews').toggle('slow'); If using JQuery up to v1.4.3 this works just fine. When switching to v1.4.4 I get an "Object expected" JScript error on this code. Can anybody help? Thanx
autocomplete
hello there , sorry for my poor english. I want to add a small function to autocomplete.js. When i mouse over one of the "suggestion" , I want to extract the "keyword" (let's say the text) how can i do? i have tried to add the .mouseover() but i cann't get the text value...when use .val()
animate() effects stacking up. Any way to disable this?
Hi, I am trying to make a piece of text glow green then back to black every time a user clicks a button. My code looks like this: $('#div1').animate({ color: "green" }, 100, function() { $('#div1').animate({color: 'black'}, 100); }); This works well. However, when i click the button so fast so many times in a row, the animation lags behind, because jQuery is trying to finish each animation to the end before going forward. Is there any way to disable this? Like, put something
jquery mobile without hijax and page navigation management
hallo, is there a possibility to launch the jqmobile extension of jquery but without the following functionality: - auto grab the links - auto manage page navigation via ids, hash, etc. but maintaining functionality: - theming - widgets (even mobile.page widget but without above stuff) the reason is: i have my own logic that manages navigation, loading of new pages, xhr, etc. so what i need is the theming and the usage of mobile widgets. so for me a page would/should/could still be a widget but
unexpected behavior
hi guys, i've made a simple tab switcher in my site, it work's like it has to; the issue is that when you scroll the page, and than try to change the visible tab, the page moves for (to me) no reason! if you want to take a look just click: http://800.omnigrafica.it here's the javascript: $(document).ready(function () { $('#zona1 .sez.active').fadeIn(0); $('#schede li span.centro').click(function(){ var sezione = $(this).attr('id') if ($(this).is ('.active')) { donothing } else{ $('#schede li span.active').removeClass('active').parent().removeClass('active');
$("tr#r26").addclass is not a function error
using this script: <script src="http://code.jquery.com/jquery-latest.min.js"></script> <script type="text/javascript"> function Antwoord(id,vraagnummer,antwoord) { alert("Je klikte op id = "+id+" van vraagnummer " + vraagnummer + " antwoord " +antwoord); } function GreyOutRows() { /* '.$jquery.' */ $("tr#r26").addclass("hidden"); } $(document).ready(function () { GreyOutRows(); });
Links on Dialog Pages does't work in nested lists.
Having one of the nested list item open a dialog upon pressing, does show the dialog popup, but clicking on the link just closes the dialog box and returns to the original page. It will not go to the page linked. Below is a sample implementation <ul> <li> States <ul> <li><a href="tennessee.html" data-rel="dialog" data-transition="pop">Tennessee</a></li> <li><a href="Alabama.html">Alabama</a></li> <li> <ul> And lets say the tennessee.html contains an a href link.
Next Page