Should I use jQuery Mobile for new development?
Hello. I'm now looking for a solution for mobile web application development and jQuery mobile seems like a perfect fit. However, the issue of MobileSafari address bar dropping down between transitions is a major one. And considering the fact that it is present for quite a long time and no official fixes are suggested, I need your opinions: would that be a right decision to start an application development with jQuery Mobile right now? I'm okay with the fact that it is alpha, but not okay if the
Clearble Text Field plugin, looses focus in IE7 & IE8
Hi, Using the Clearble Text Field plugin v0.3.2 and have come across a problem with IE7 & IE8. The first time a text field with clearableTextField is used, when then 1st character is typed the text field loses focus. Futher uses are fine till page is reloaded. Works fine in Firefox 4, Chrome 10, Safari 5 and Opera 11 I created a very very simple page to rule out anything else on the page and still the same. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Disabling one JQuery if another one is used
Hi, To begin, I'm a novice at this. I'm using 2 JQuerys on a page - $(document).ready(function() { $("body").css("display", "none"); $("body").fadeIn(2000); $("a").click(function(event){ event.preventDefault(); linkLocation = this.href; $("body").fadeOut(1000, redirectPage); }); function redirectPage() { window.location = linkLocation; } }); </script> <script type="text/javascript"> $(document).ready(function() { function filterPath(string)
jQuery throbber plug-in
Hello everyone, I am experimenting with the jQuery throbber plugin (http://plugins.jquery.com/project/throbber). It does not behave the way I would expect it to. My setup is as follows. I have a HTML form with a button. When the button is clicked, I initiate an AJAX request and would like to replace the button with a throbber. Upon reception of the response, the throbber must again be replaced with the button. The relevant jQuery code looks like this: // Prevent caching of the requested AJAX pages
POSTs not transmitted
Hello, I have problems with a jQuery script. At the beginning, the script displays 2 forms. When we click or write in one of the forms, then: - it adds a new line only if the clicked one was the last line, - it POST forms data of the line into a PHP file. But my PHP file does not receive any POST. $_POST result is :Array () Here are my complete HTML file (1) and PHP file (2): <script type="text/javascript" src="js/jquery.js"> <script src="js/jquery.min.js"></script> <table id="tab"></table> <script>
Does the jParallax plugin also work with a more recent jquery library than 1.2.6 ?
I 'm trying to combine multiple jquery plugins, including parallax. But when I use a recent jQuery Library, my parallax won't work. Does the parallax plugin only work with library version 1.2.6 or are there more recent library versions which i can use?
Right Pane Vertical Menu -> Left Pane Images Mouse over menu
Hi All, I'm looking for a menu that has tabs in the right side placed vertically and in the left side there will be images showing accordingly which menu item is mouse hovered. Please advice, Thanks
Superfish Menu Not Using Current State on Current Page
I've been able to develop a vertical menu system with Superfish Menus and have been able to style it. Unfortunately, when I click a link to a different page, it does not highlight the 'current' state on that page's menu item. Rather it just stays on the 'Home' link. Plus, after reviewing the code, after every menu I create there's a bunch of javascript code at the end. I've never seen this before in the past and am wondering why is it loading (and bloating). Rather odd behavior. Code: .sf-menu {
Where is themeswitcher?
The link http://jqueryui.com/themeroller/themeswitchertool/ doesn't work--where can I get the current version?
$.post returns data but does not display it
Hi guys, I need help with my $.post, it calls a php file which retrieves data from my database and should return a JSON datatype result. I checked on firebug, and it does successfully retrieve the data in JSON format. I however cannot get it to display on screen. I want to populate input fields with the result accordingly. Here's a chunk of my javascript: (this function is being triggered by a dropdown) function updateBillingAddFields(address_book_id) { jQuery.post("ajax_checkout_confirmation.php",
How to submit a handler to an HTML button to a function bound to it via the jQuery bind-function
Dear all, this is embarrassing - but I can't figure out how to do it: what I want to achieve is to design an elegant way to test a larger JavaScript code... for that purpose, I want to find a way to test several of my methods (and their results to different inputs). My idea is to create a simple document, in which several HTML buttons can be clicked by a user, and then each time on click call the same JavaScript function and submit an input to it (which needs to be defined in an intelligent way -
How to restrict UI draggable to the viewers screen
I have a draggable which is huge in width and height... 99% of the cases it will cross the users viewable area. I want users to drag to see the rest of div... (no scroll bars) but when they reach the end it should not move out of the viewable area and show empty space behind the draggable. It should stop at the edges of the viewable area... How can I achieve this using draggable... I have already implemented draggable but it allows the user to move beyond ends of the draggable DIV... Here is a nice
how can i prevent jquerymobile from putting the ... too early on a list item
http://screencast.com/t/6hfPFurn If you look at this pic, you can see there is plenty of space left. Ideally, i'd like the text to run all the way to the right or even runover onto second line. Thank you, TF
plugin doesn't always instantiate
Hi Everyone, I am working on my first plugin called Filmstrip and I can't seem to debug why when you call the plugin, it doesn't always instantiate, therefore rending nothing. As best practice, what should I be doing to ensure that when my plugin is called, all the info that it needs is available and/or always works? - should i create a timer to ensure it has what it needs? - should i include a preloader? any suggestions would be greatly appreciated; i think this link can show you what i mean: http://jquery.marlonvalenzuela.net/filmstrip/
jquery tabs - how to disable ajax
I have rolled my own ajax call triggered to the select event since I need to return some form post data with the ajax call. How do I disable the standard ajax call within the tabs module? I don't want to be making unnecessary roundtrips to the server.
jQuery Cycle - set slide based on current hash upon refresh
Hello, I am using the cycle plugin for an overall navigation. I am happy that it's adding hashes although opon refresh it defaults to the 1st slide. Can we set the index slide to the current hash? Can the current slide based on the hash be viewed based on URL as well? Will this idea fix both those problems? thanks! function setSlide(index) { $('#slider').cycle(index); }
Liberate memory of DOM ! Need Help ! Please...
Hello everybody ! Sorry for my English... I'm French... I've a big question ! I'm working with my iPhone, but my question is jquery and not jquery mobile so : I've a structure of page : <div id='art'> <video id="vid"....></video> </div> To empty my div, I make $('#art').html(''); But when I test : var movie=document.getElementById('vid'); $('#art').html(''); alert(movie); I have an object [html Video].... and not null... So it's in my dom and in my memory... so : my method is bad ? How
How to monitor any HTML element for a change - in either it's inner HTML or CSS...
.change() is only for form elements minus check boxes/radio buttons, etc... Are any of you aware of a script that does this already? Hopefully one that is easy to implement... I just want to monitor things like height, number of inner elements, or any change in the inner HTML... thanks, j
Slideshow style image transition on click??
This is the HTML I am currently using: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style type="text/css"> #container{width:960px;margin:0 auto;overflow:hidden} #sidebar{width:300px;float:left;margin:0 20px 0 0} #sidebar ul{list-style:none} #sidebar li a{color:#363636;text-decoration:none}
Superfish Menu Font Question
I'll admit I'm no expert on CSS, but I thought I could figure out what style or class is controlling the size of the first submenu font in the standard Superfish menus, but I can't. The first set of menu selections looks to be about 1 point smaller than the subselections that appear when I hover over one of the first menu selections. Can anybody clear this up for me? Thanks. ---------- Rick
How to do this effect (fadeIn?) without plugins
I have a div (background red) and I'd like to shade it to black, such as fadeIn() function from red to white, instead of display:none; to the color. Is it possible do it without plugins?
jQuery pm system
i have made a small pm system with jQuery for my site. When the page loads i would like the content of the first pm to be loaded into the div on the right. the div on the left holds the subject name and sender of the pm. All the pm divs in the left pane have ids beginning with message- and are followed by their id in the database: <div id="message-109"> the message content is housed inside a hidden div with the same id type <div id="content-109"> then when a message is clicked this div is simply
Microsoft .NET chart controls on mobile
I am using Microsoft .NET chart controls to render some bar graphs. how do i display the charts so that they are mobile optimized ? I am using JQM libraries for presentation and C#.NET for backend. Please advice. <div id="dvTabContainer" style=" margin:0px 0px 0px 0px;" > <cc1:TabContainer ID="TabContainer1" runat="server" OnActiveTabChanged="ChangeTab" AutoPostBack="true" Width="750px" ActiveTabIndex="0" > <cc1:TabPanel ID="tab1"
Best RSS / JQuery Option??
Hey Gang, I need a solid and reliable RSS parser for my web page. I saw jPage and it looked good except the RSS must be on the same domain - which seems to miss the point a bit. I need a high level of control in the display of content, and any help is much appreciated!
Need to write URL to HTML but it loses query string symbols...
I am using this in a java script block to write code to a page (for use as a new XML set: html += ' <segurl>' + vurl + '</segurl>'; But the printed URL var is deleting all needed characters in the string, leaving this: http://www.bctest.com/fullplayer.aspx#/ Show 70: New Hospitals Are Needed/BCTEST 04.10.11 - [1] New Featured Story/608459720001/898494604001/895805715001
Any page with a select using data-native-menu=false modifies the page title with the placeholder option text.
Example: jQuery Mobile's own documentation page: http://jquerymobile.com/demos/1.0a4.1/docs/forms/forms-selects.html As you can see, the <title> now contains "Choose one..." several times, once for each select using data-native-menu="false" that has placeholder options. Any ideas on how to fix this?
using hover with live function
my jquery was intially was $(document).ready(function () { $('ul.nav li').hover( function () { $('ul', this).slideDown(100); }, function () { $('ul', this).slideUp(100); } ); }); this works well , but
Can't select "dynamically" created element by id
Hi all. I'm confused by some jquery behavior. I've scoured google for an explanation, but I don't get it. I'm creating some rows and cells in a table with javascript. I'm then trying to select these cells individually by id, but jquery can't seem to find them. It always returns length 0. The jquery code is, I believe, executing after the cell creation, so I would expect them to be in the DOM already. I can bind the click event to each cell by selecting the cell's class. Why can I select the class,
How to handle theme with transparent backgrounds than also use Ajax dialogues
I've built a simple CMS that handles different themes based on the jQuery CSS class structure, and also uses Ajax dialogs to edit page content. Switching between standard jQuery themes works a treat. But if falls over when a client wants a theme based on transparent background, as the Aiax dialogues based on the ui-widget-content class then also apear transparent; resulting in the user geting very confused. I've fixed the problem by basing the client site theme on non ui-classes, and the Ajax
Jquery autocomplete remote call - disable after a space
Sometimes my autocomplete ajax takes too long and the response happens too late - is there anyway to close the autocomplete processing/drop down (ignore the results from the JSON) once a user enters a space character? Thanks I'm using: $(function() {
var cache = {},
lastXhr;
$( "#birds" ).autocomplete({
minLength: 2,
source: function( request, response ) {
var term = request.term;
if ( term in cache ) {
response( cache[ term ] );
return;
}
lastXhr = $.getJSON(
Problem with Cancel button when jQuery Dialog is combined with jQuery Load function
Hello everyone! My team and I are having an issue with the Cancel button not working in our jQuery Dialog. When the user clicks the button, nothing happens. All of our JSP files are based off a template.jsp that calls the jquery-1.4.4.min.js and jquery-ui-1.8.10.custom.min.js scripts. On our main page, we have a button that we would like to click and call a javascript function (showHistory) that displays a modal dialog. This modal dialog would display the history page from our site. The code that
jQuery UI Autocomplete extraParams Problem
I have a jQuery autocomplete application where the user types a query into a text box and autocomplete suggestions are returned. (It's working fine.) I would like to restrict the suggestions that are returned by passing the value of the selected option from a drop-down list (#deptField3) to the PHP script that does the autocomplete look-up. Here is my code: <script type="text/javascript"> <!-- $(function() { $("#directorySearchField-desktop").autocomplete({ source: "/directory/includes/scripts/autocomplete.php",
How should I make a div change image when changing the page in drupal?
I have next url for you to look at www.jellev.com/bloem/ and i want the blue bar to contain an other image for 'some' pages... the action should be performed on the click of the menu items of my drupal site. I was thinking that this would be easy with jQuery but the problem is that jQuery is a clientside action and when the link is clicked its a server side request response and the image should stay the same... is this a little clear ...? It's a very complex explanation for a simple problem i think.
Check each Property of an Object
Hello, i am locking for something to get all Propertie`s of an Object (with an each loop?) <div id="blub" class="blah" name="blah"></div> <script> $('div').attr(function(){ //somethink like that. Know that its wrong $.each(this) }) </script>
images resizing not working proper
I have a lot of images on a page and the have to be a little bit larger, so i dont want to change all of the css. I have made a couple of lines of code which doesn't give the right values back. The images have all diffrent sizes. $('.imgbox').each(function(){ var getX = $(this).width(); var getY = $(this).height(); var addX = 10; var xH = getY + addX; var xW = getX + addX; $(this).children('img').css({width: xW + 'px', height: xH+ 'px'}); });
Getting colors from jQuery UI themes
HI there, I'm trying to get the colors from the current jQuery UI theme from javascript - I've tried the following, but they always seems to return the same color no matter what theme I'm using: $(".ui-state-hover").css("color") $(".ui-state-default").css("color") etc. Any advice appreciated. Best regards, ~Kieran Simkin Hybrid Logic Ltd http://hybrid-sites.com/
attaching events to dynamically added elements
I have a form where the user can add new fields by clicking 'add another item' button. Each new field has a 'remove' button attached to they can remove that field if they don't need it. the remove buttons all have the same class: 'removeItem'. Then, in my jQuery I have the following: $(".removeItem".click(function(event){ $(this).parent().remove(); }); The only element that this woks on is the original element in the source, but not any of the dynamically created elements which basically look
Help with multiple jQuery in Wordpress theme!
Hello! I am very new to jQuery, and I seem to be having trouble with it.... I am creating a wordpress theme and I want each post to open in a lightbox i-frame, but since my site already has some jQuery for the basic layout [horizontal site, autoscroll, etc.], I can't get any lightbox script to work! I've tried adding it manually to the theme and even tried adding it as a plug-in in wordpress, but it doesn't work... Any ideas on how to get it to work? I appreciate any help... This is my code: <!DOCTYPE
Script to make Table Cells equal height of the tallest cell - Per Row, but it is making all cells the height of the tallest cell on the page!
jQuery version: jQuery 1.5.2 Problem Description: I am using the following HTML to show 6 categories on a page, each category has a different size list of items beneath the cell heading... I want to make the height of all cells PER ROW to be equal. My script currently is making ALL cells on the entire page the height of the largest cell. How can I make it only apply the highest height per row? jQuery Script: var divheight = 0; $(".lRow").each(function(){ $(".nexTextblock").each(function(){
Accordion - what am I supposed to do?
I can't get the accordion to work. I don't even know if I've forgotten something important, or if I've just made a minor error somewhere..? This is in the header: <link rel="stylesheet" type="text/css" href="css/ui-lightness/jquery-ui-1.8.11.custom.css"> <script type="text/javascript" src="js/jquery-1.5.1.min.js"></script> <script type="text/javascript" src="js/jquery-ui-1.8.11.custom.min.js"> $(function() { $( "#accordion" ).accordion(); }); </script> ¨ And this is the body: <div id="accordion">
Next Page