How to make tool tip appear over my div rectangle?
I have 2 rectangles and a paragraph with text on my page. I need to make a tool tip appear when the mouse is over each of them. I have got this to work for the p but not the rectangles. I am guessing because I can't add my css tooltip class to my div rectangles? #rectangle1{ css for my div id rectangle one position:absolute; border:1px solid #333; padding:2px 5px; background-color:red; top: 100px; right: 100px; height: 100px;
JQM page is not getting refreshed when revisited
I have total four pages: Page1, Page2, Page3 and Page4. Page3 contains Select dropdown menu. Previously, when I was selecting a value from the dropdown of Page3 and move to Page4 and return back to Page3, the selected value does not get retained and the Page3 get reset to its default value. So one of the developer suggest me to use data-dom-cache="true" on Page3 and my problem was resolved. But it has created an another problem. Page1 -> Page2 -> Page3 (No problem) Page3 -> Page2 (No problem) Page2
I'm trying to activate a 'prev/next' function on the jquery plug in below but it's proving a tad difficult? where am i goin wrong
Here is the html <li> <a class='prev' href=''>previous</a>/<a class='next' href=''>next</a> </li> and here is the script jQuery.fn.preload = function() { this.each(function() { jQuery("<img/>")[0].src = this; }); }; $(document).ready(function() { if (!$("body").hasClass("splash")) { return; } $('#video-bg').videoBG({ position: "fixed", zIndex: -1, mp4: '/videos/splash/loop_intro.mp4', ogv: '/videos/splash/loop_intro.ogv', webm: '/videos/splash/loop_intro.webm',
jQuery ajax callback issue
When sending ajax request to my JSON Service method, the method inserts the data into backend and runs return true/false. Sometimes the success callback function is not being called after returning from JSON Service method without exception. I am unable to reproduce this in my development and qa environments. But it is happening to 1 or 2 users for every 1000 users in Production. If that users retry, it works with no issues. Below is how I am sending ajax request $.ajax( { type: "POST", url:
Using roundabout in coda
Hey y'all. Please don't hate me for the following code if it is hopelessly amateur: I am but a hopeless amateur. Its just a sort of demo idea that i'm messing with... there are extra objects etcetera in the css that i'm not using yet and so on... this is my first attempt with css, java, or even html, really. I'm trying to put some roundabouts in coda, as the title suggests. I'm fairly sure that I'm not double-calling jquery. Problems: The width of the ul in roundabout, which usually effects the
Need help in writing selector
Hello , i have a structure like this... <ul> <li class="xxx"><a href="#">Title 1</a> <ul> <li><a href="#">Sub Title 1</a></li> <li><a href="#">Sub Title 2</a></li> <li><a href="#">Sub Title 3</a></li> </ul> </li> <li class="xxx"><a href="#">Title 2</a> <ul> <li><a href="#">Sub Title 1</a></li> <li><a href="#">Sub Title 2</a></li> <li><a
Wordpress Application of collapsible-set
I'm trying to apply this markup <div data-role="collapsible" data-collapsed="true"> based on a jQuery Mobile tutorial describing how to collapse a listview. How can I do this in my code below for each category, please?
Send List Data
Hi, I´m making and app that the user is adding element and I show is to the user in a Main View with a List (as a shopping cart) and I want to know the way to send it to the server. My first idea is a button binded to a JS Function that will access to the dom, search for all li items, get the data, send to the server and if it is successfull, them navigate to other action. Is there any more simple for doing this? Thanks
"grunt custom" doesn't work.
D:\Code\github\jquery [master]> grunt custom:+ajax,-dimensions,-effects,-offset path.existsSync is now called `fs.existsSync`. Running "custom:+ajax" (custom) task Creating custom build... Done, without errors. D:\Code\github\jquery [master]> cd .\dist ; ls 目录: D:\franckfang\Code\github\jquery\dist Mode LastWriteTime Length Name ---- ------------- ------ ---- -a--- 2012/10/14 17:57 0 .sizecache.json I don't know why there is nothing in
Who manages Authors.txt?
Just being nosy, how is that authors.txt kept up-to-date? There is a grunt-task for this "grunt authors", but it shows a much longer list. (arround 200 lines from the task and roughly 130 in the file) Furthermore it seems that some updates are done manually and others occur along with some closed pull-request. Is there some secret rule? e.g. "only users with a public email address in their profile". Just one sample: Sai Wong (committed lots of code on October 16th) is not in the authors list. Searching
JSON or HTML?
What's considered the best way of getting data from a remote server into a JQM app if given the choice, JSON or HTML? JSON requires more work on the client side and the HTML method generates more markup that needs uploading to the app via ajax...
The best way to implement a persistent, fixed, header navbar
Hello, I'm developing a simple three tabs app for Android and iPhone. Every tab links to a div with data-role="page", as jQuery Mobile specifications. I'm using jQuery Mobile as UI Framework and IBM Worklight. If I implement the jquery fixed persistent tabbar like is explained there (http://jquerymobile.com/demos/1.2.0/docs/toolbars/footer-persist-a.html), i'm encountering some flickering on the tab item (text both images) in page transition (with any transiction effect). If I set the default transition
Can't access all fields in an iframe
Hi guys, I have an issue on my phone running Android 4.0.4 with JQM 1.2 final. I have an iframe with text fields and dropdowns, but the iframe is too wide to fit in the phone window when in portrait mode, so I get a horizontal scroll bar so I can scroll to see all of the fields. When in portrait mode I can only access the text fields and dropdowns by clicking them if the iframe is scrolled all the way to the left. This means I can't access any of the elements that are off to the right of the page.
Tiny Cirple Slider issue in wordpress
I want to use this slider from http://www.baijs.nl/tinycircleslider/ on my website to view different images and for some reason it doesn't work with my wordpress showing this error: TypeError: $("#rotatescroll1").tinycircleslider is not a function $('#rotatescroll1').tinycircleslider(); That's how it should look and work: http://www.itsepic.co.uk/wp-content/themes/itsepic/branding/index.html Any ideas what's wrong ??
Superfish not keeping flyout visible when mouse moves off target
Updating a site dating from about 2002, I added a superfish based menu, with a delay when the mouse moves off the menu item to keep the flyout section visible for a bit in case the user moved the mouse the wrong way and missed the flyout. (based on superfish example = http://users.tpg.com.au/j_birch/plug...rfish/#sample3 ) Originally the site used tables and a nested table (it was from 2002!!!) and the new menu worked okay when still sitting in a table cell. Then I did the final conversion to using
Why is my events only working on internet explorer 9 and why is my mouse enter/leave events not fully working?
I have a page of events here with two boxes a red and yellow box. The red box shows the events i.e. the x coordinates, when the mouse is clicked and double clicked. It also says mouse enter when the mouse enters the yellow box and is supposed to say mouse leave when it leaves. None of this works with chrome and I don't know why half works with firefox and all of it works with I.E 9. Another problem is the mouse enter only shows the pixel it hits the yellow box then goes back to showing x coordinates.
Popup with header and close button can't have rounded corners?
I think this might be a CSS bug in the popup styles. The code is a slight variation on the popup samples in the documentation. Put this HTML inside a page: <a href="#about" data-role="button" data-mini="true" data-rel="popup">About</a> <div data-role="popup" id="about" class="ui-popup"> <a href="#" data-rel="back" data-role="button" data-icon="delete" data-iconpos="notext" class="ui-btn-right" data-theme="a">Close</a> <div data-role="header"> <h1>About</h1> </div> <div data-role="content">
Tab type jQuery image holder/slider
Hi All, I am looking for a image holder which has 2 tabs with up/down to move images next and previous. An example image is given below. Can you please advice me a way to do this?
jQuery Session Plug
So I'm trying to do some basic session management here, between jQuery and PHP. I'm attempting to set session variables in jQuery, and then access them on the next page using PHP. I'm using the jQuery Session Plugin found here: https://github.com/AlexChittock/JQuery-Session-Plugin PAGE 1: [code] $.session.set('username', 'UsErNaMe'); [/code] PAGE 2 (PHP): Outputs "NO USERNAME SET" <?php session_start(); if(isset($_SESSION['username'])){ echo "USER NAME IS " . $_SESSION['username']; }else{
Validation: how to run on Submit
I have used validation plugin and it starts showing error message while the user is still typing. How to make it work on form submit so that error message is shown only if there are errors while submitting?
Blackberry 9700 OS 5.0 Form elements problem
Hi, I have spotted an issue on the Blackberry 9700 Bold and OS 5.0. It can be replicated on the device by going to the jquery mobile docs site: http://jquerymobile.com/demos/1.2.0/ and then clicking on Form elements > Form basics. The browser seems to hang there with the jquery mobile loading gif in the center of the screen. I haven't narrowed it down to a particular form element (or combination of form elements) yet. Screenshot: Can somebody look into this please? Thanks Mark
Whats the difference between these selectors?
I noticed 2 different selector patterns but can't work out what the difference is. Parent Div = ".mydiv" 1) - $(a, .myDiv) 2) - $(.myDiv a) Anyone?
jQuery Mobile JS-commands problem
Hi! I'm new to jQuery and I'm sorry if this has been asked before, but I have spent hours on this forum and on Google but to no effect. I have built a well working jQM version of my wordpress site and I'm quite happy with the way it looks and works with one exception. When you turn your phone to landscape orientation the top header takes up too much space. So I dove into the JS part of jqm to change the fixedtoolbar behavior on orientation change. To the problem: None of the jqm commands such as $("[data-position='fixed']").fixedtoolbar('show/hide/toggle');
jQuery Validation - how to show errors on alert();
i want to display the errors on an single alert() but it's not working. What i'm doing wrong? Anyone can help me? this is my form code: <form name="form_news" id="form_news" method="post" action=""> <input type="text" id="email" name="email" value="" title="Email" placeholder="Cadastre-se e receba nossas novidades."/> <input type="submit" class="bt_news" name="submit" id="submit" value=""/> <div class="clear"></div> </form> And this is my script: <script type="text/javascript">
.html() problem
I am loading some html into a div Then I need to calculate the height of the div once the html is added. My problem is that the height calculation occurs before the html is loaded sometimes. Here is my code executed at the completion of the ajax call to get the html. if (value) { $('#lmenu').html(value); pageheight(); } the pageheight function is function pageheight() { var menuheight = parseInt($("#lmenu").height()) + parseInt($("#menu").height()); var recheight = parseInt($(".ui-page-active").height());
date picker with simulators
Dears, I developed a mobile application using jquery + html5 (phonegap), I've a text input with type = date when I run the application on android simulator the date picker didn't appear but the keyboard which appeared, also when I run the application on iphone simulator I faced the same problem, also when I run the application on windows mobile 7 simulator the same issue appears. when I run the application on android device the date picker appears, also on iphone device the date picker appears. I
remove form label and element
Hello! I have form with many elements. I want remove with JQuery only checkbox and his label "remove the current file" : Here bad form: <form name="sf_method"> <input type="file" name="product_category[image]" value="822db2.jpg" id="product_category_image" /> <br /> <input type="checkbox" name="product_category[image_delete]" id="product_category_image_delete" /> <label for="product_category_image_delete">remove the current file</label> </form> Here what I want to get (only file input element): <form
collapse and expand (jquery or javascript)
Hi everybody, I have several images one next to the other and I would like to be able to create a expand and collapse text under this line of images, but when clicked, each image should display a different text. How can I do that ? Thanks for your reply. As I am a new Jquery / JavaScript user a detail answer would be very much appreciated ;) , avoiding me to struggle hours !! Bye and thanks again
date picker with simulators
Dears, I developed a mobile application using jquery + html5 (phonegap), I've a text input with type = date when I run the application on android simulator the date picker didn't appear but the keyboard which appeared, also when I run the application on iphone simulator I faced the same problem, also when I run the application on windows mobile 7 simulator the same issue appears. when I run the application on android device the date picker appears, also on iphone device the date picker appears. I
[jQuery Mobile] text refresh not working on Blackberry
Hi! I have a small listview in my html: <ul data-role="listview"> <li id="@Local_Time_Formated" data-obfunc="sValues">Local Time: {SVALUE}</li> </ul> I request some svalues from a server in the onload html function. So the {SVALUE} text should be replaced by the response from the server. First I select the right 'li' element in the HTML (actObject). After this I set the new text: jQuery(actObject).text(jQuery(actObject).text().replace('{SVALUE}',varNewStringValue)); jQuery(actObject.parentNode).listview('refresh');
$.ajax with $.each
I have several divs equal with different values and I'm trying to get all the id like this: $(".compartilhamento").each(function(){ var compartilhamentos_id4 = $(this).attr("id"); var compartilhamentos_id3 = compartilhamentos_id4.split("_"); var compartilhamentos_id2 = compartilhamentos_id3[2]; }); and now I have all the ids in a var.. I use this var and sends it to a php file.. how i do it ? $.ajax({ url: "ajax/load.php", type: "post", dataType: "json", cache: false, data: {
jQuery Cycle initially not loading properly
Hi, Since I couldn't find the answer to my problem on the forum or google I'll have to ask it here. I've installed Cycle on my website, but when you initially go to it, it doesn't load nor Cycle nor the images, it just doesn't show anything. Only when you go to the website the 2nd time (simply to 'refresh' doesn't work either) it works. Since I have no idea what could be the problem, is there anyone that does? You can find the website here. Thanks in advance!
wich datepicker do jquerymobile team and users recommands?
Hi, I use your great tool for many websites, for thoses, I always encounter the same issue : I always need an "interligent" datepicker (the input type="date" is not enougth), From now, I've been hesitating using datebox but it seem preaty heavy and seems to not provide as much as the jqueryUI's that I'm use to (and seemsto not work with the latest version of JQM). So until now i've been on my own way, poorly maintaining an unsatisying version of the one you've provided until the beta 4. But it's
delay string of aniations
I have a string of animations, each animation is applied to a different object i want to delay the start of each animation. I know i need to use the delay() method but i cant figure out how to create a animation que, with delays in between each animate when all of the animates are applied to a different object. if it helps what i am doing is i have a list of divs, each with different content. One is displayed at a time. I want the existing one to fade out and the next one to fade in at the same time
Mobile Themes can be nested with a scope?
I saw this: http://www.filamentgroup.com/lab/using_multiple_jquery_ui_themes_on_a_single_page/ But I want to take it to the next level. Would it be possible to add nested css scopes like this? <div id="parentContainer" class="theme1"> <input type="button" data-theme="a".... <div id="childContainer" class="theme2" <input type="button" data-theme="a" .... </div> </div> The problem is if I define themes like the follow css code, theme2 takes the values for
The ui argument for my popupbeforeposition event handler is empty
I have a JQM page with a popup and I have subscribed to the "popupbeforeposition" event with this line: $(document).on({ popupbeforeposition : populatePopupForm }); the populatePopupForm function has this signature: function populateForm(event, ui) { ... } This works excellently, except my ui argument is empty ... as in: {} - when I console.log it, the object is empty. The event argument is full of data, but none of which tells me what element triggered the event (which is what I need to populate
Matching sums to answers
I am creating a simple maths game where a grid is populated with hidden numbers. These numbers are answers. When a hidden number in the grid is highlighted, a sum linked to that answer will appear in a div. The user will then choose a number that fits in the sums answer. At the moment I am having trouble with pulling out the right sum for the answer. I do not know why but say the sum is "4-3=" the answer will not be "1". I think it is because I have not defined "answer" but am not sure. <ul style="display:none;"
In Jquery mobile i want to use image button for showing menu and menu name must come full character without dot
JQuery Mobile Menu making & dot removing from text on button how to give image as abackgound of a menu and in a page i want to show six menu 2 first below 2 and 2 total six. also i want to show menu name on each menu at bottom. But when see in different mobile and ipad or any device dot never want to come. main thing is responsive design. can any one help me from this issue.
Show a class within a class
I have the following html: <ul> <li><img src="./images/ccp.jpg" id="image"></li> <div class="acj" > <li class="gec">text</li> <li class="gec">text</li> <li class="gec">text</li> <li class="gec">text</li> </div> </ul> I have a style which hides the list to begin with: <style> .gec{ display:none; } </style> I want to show the list when the image is clicked on and I'm using the following code: $(document).ready(function () { $("#image").click( function () { $(".ccp
Word wrap
Hallo, I using the following syntax to perform word wrap (white-space: normal;) The command is able to perform word warp on simulators and emulator but when I ran the app in an actual mobile device, its not performing the word wrap. Any one with some advice?
Next Page