jQuery - Infinite scrolling
I'm trying to implement infinite scrolling on my page, how ever something has messed up, instead of triggering at the bottom of the page it's triggering when I scroll back to the top. Does anyone know what could be triggering this? $(window).scroll(function() { if($(window).scrollTop() == $(document).height() - $(window).height()) { alert("hello"); } }); I'm currently using the code above, which works in jsfiddle just fine. I also tried an alternative of - if($(window).scrollTop()
Terminate a jQuery Mobile Session
Hi, sorry for asking a perhaps trivial question but after a long search I didn't find an answer yet. I want to stop jQuery Mobile to interact with my page if the user hits a link to change layouts. However, even if the page I generate with php does only contain a plain <!DOCTYPE html> <head></head><body><p><a href="./index.php">Non-mobile Version</a></p></body></html> I still got the jQuery overlay and CSS as well as the previous page mingled within the source code as if jQuery mobile generates a
how to pass a parameter to jquery script and set a file path dynamically
Hi everyone, I have a form that contains: <form id="fileupload" action="http://localhost/bootstrap1/blueimp/server/php/index.php?uid=16&" method="POST" enctype="multipart/form-data"> When the form page loads, previously uploaded files are supposed to loaded into a table using the jquery. getJSON method like so: // Load existing files: $('#fileupload').each(function () { var that = this; $.getJSON(this.action, function (result) { if (result && result.length)
Stop Repeating my code, better solution for dragging?
Hi, I have 16 divs which contain 16 images, one in each. My code is below and my question is is there a better way to do this. My problem is each div has its own class to format it. Maybe in my css I use an element for each div and one class. $( '#divCleanTool1').draggable({ helper: "clone", cursor: "move" }); $( '#divCleanTool2').draggable({ helper: "clone", cursor: "move" }); $( '#divCleanTool3').draggable({ helper: "clone", cursor: "move" }); $( '#divCleanTool4').draggable({ helper: "clone",
resizable works incorrect in FF
If you open http://jsfiddle.net/UVsKp/413/ in opera it works just fine. But if you open it in firefox you will see resize icon in the bottom of display. How can I solve this? thanks
How to make a multiple select drop down list
Hello, I would like to know how to make this ( http://www.atlassian.com/resources/better-together ) 2 drop down lists which makes content appear depending on both 2 selected items in the drop down menus, is there any documentation or already made plugin so I can use to achieve this? Please I need help!!!! THANKS!
fixed position issue
http://jsfiddle.net/rajkumart08/8p2mZ/2/embedded/result/ when i click the more options a popup comes but when i reduce the width and height if the browser using mouse... the popup does not move along with more options div... how to fix the issue pls help my code is here http://jsfiddle.net/rajkumart08/8p2mZ/3/
Show image by image from link
Hello I'm pretty new in jquery and I hope you help me. I have images on my server. With php read dir and create xml file like this: <?xml version="1.0" encoding="utf-8"?> <data> <link><img src='slike/aaa/Capture.JPG' ><br /></link> <link><img src='slike/aaa/IMG_20120806_190517.jpg' ><br /></link> <stevec>2</stevec> </data>I want that jquery get link by link and show image. When user click on button Next, show next image. Is this possible?
problem with sliding sub-menu
Hi i have problem with my menus... when i click the menus, then sub menu will be dropdown... but i want to change it to mouse over . not click~ what do i have to change it ? Plz help T_T --------------------------------------------- this is the jquery source ... jQuery(function($){ // Frequently Asked Question var li = $('.menu>.li'); li.addClass('off'); $('.menu .on').find('.depth2Wrap').show(); //li.eq(0).removeClass('off'); //li.eq(0).find('.a').show();
Change plugin-vars "onBeforeInit"
Hi, developed my own Image-Carousel which automatic resizes, when the window is resized or in my case when the orientation of a mobile device is changed. Now I want to change to number of displayed slides in Landscape-View, but i dont know how to change my "Setting"-Vars in my Plugin-Call Here is the basic Code of my Plugin: (function($){ $.fn.didiCarousel = function(settings) { var defaults = { displaySlideQty : 2, moveSlideQty :
using tabs to change multiple divs
Hi Need some assistance in changing some divs using tabs on a website I am building. I currently have it set up so that it changes through a set of scrolling tabs on mouseover of a separate div. I now want to also change another div with separate content as well. This works currently on the first div: $(document).ready(function() { $("#selector").tabs("div.scrollable", {event:'mouseover', initialIndex:2}); }); However is I add similar to change the extra div it only changes the last div referenced
scrolling a realtive number of pixels
Hi, $.mobile.silentScroll(coordY) scrolls to the absolute position coordY. I would, however, like to scroll a relative number of Pixels. In other words, to add some pixels to the actual scroll position. To do so I could either: - read the actual scroll position (how?), add some pixels and use silentScroll(...) - use a command like $.mobile.silentScrollRelative(deltaCoordY) (does it exist?) Any help would be greately appreciated.
Jquery Sliding images on ASP.NET
I am working on website which includes lot of images. I decided to use jquery.i refer to this code Here. In this it shows album of images when you click on album it shows all images thumbnail.clicking on thumbnail it shows large view of that image. It works fine in html page. When i used in .aspx page as I click on album image thumbnail it not showing large preview. It shows text under image. All path are correct. After so many tries I found that it not working in chrome browser in office but same
How to add admob to my jquery mobile site?
Hi, I want to add admob in my jquery mobile site. suppose i want ad in add mob mean, i created add mob in my gmail account.. I created.. now i want pub id.. how to get it?? please explain
Synchronous request timed out
Hi Folks, I am working on jquery mobile with Phonegap! I am having jquery ajax calls where in I am getting data and populating the UI. There is one URL which is taking 30 seconds to get the data. When I am hitting the url using ajax call, I am getting Synchronous request timed out error. The exact log I am seeing in my log is: WebUrlLoaderClient(986): Synchronous request timed out after 10 seconds for the 2th try! I tried to increase the timeout of the ajax call as shown below, but still I am getting
Onclick of an image, dropdown hide
Hi, I am need of a help regarding onclick image in a dropdown. When I click any of this dropdown, I am able to show the dropdown. When an user click any image inside the dropdown, I can able to replace the dropdown arrow with that selected image. But user need to click the next arrow two times to show the dropdown. This is screen shot of the actual, First Screenshot: Second Screenshot: Third Screenshot: My JS: -----------------------------Starts here-------------------------------- var icon ; function
load event not triggering
Hi, I'm loading the div successfully but it is not showing the alert message on load. I want to set click event on the input field which is inside this div. Please somebody help me. . Here's my code. <form method="post" id="frm"> <select id="opt"> <option value="1">Controlled</option> <option value="2">With Notification</option> <option value="3">Periodically</option> <option value="4">Simple</option> </select> </form> <div> </div> <script src="js/jquery.ui.core.js"></script>
Onclick of an image, dropdown hide
Hi, I am need of a help regarding onclick image in a dropdown. When I click any of this dropdown, I am able to show the dropdown. When an user click any image inside the dropdown, I can able to replace the dropdown arrow with that selected image. But user need to click the next arrow two times to show the dropdown. This is screen shot of the actual, First Screenshot: Second Screenshot: Third Screenshot: My JS: -----------------------------Starts here-------------------------------- var icon ; function
PhoneGap (iOS Simulator) - Unable to display/load images [?]
I am currently using jQuery Mobile (PhoneGap) - HTML5 + CSS5 + JavaScript and then I convert it into Xcode that supports jQuery Mobile (PhoneGap) before deploying it to iTunes store but I notice some of the images [?] does not appear on iOS Simulator yet I tested web app and it works (100% - all the images can load/display) but slow loading due to server unlike iOS Simulator because it runs pretty normal. I notice small icons work but not the big icons like size width - 740, height - 430. I think
replace text between tags '<' and '>' regex
Hi, I would like to replace this: e.g.: <p class='test'>....</p> with: <p class="tes"'>....</p> i.e., would like to replace all " \' " with " \" " using regex for all text between '<' and '>' . Regards
I am trying to add nav buttons and a caption to a slideshow. Please help.
Hello all, I have just began experimenting with customizing the features with JQUERY. I have used a few ( but not many) plugins in the past but could not find a free one that alows me to do what I want. Anyways, I have started with the JSFIDDLE code found in another thread on here (https://forum.jquery.com/topic/how-to-make-an-image-clickable-in-jquery-slider) and it is working great! However I need to be able to add a pevious and next button as well as a caption that shows on hover. the Idea is
datepicker regional dateFormat
Hi there, I am trying to use the datepicker on my site. But I cannot get it to change to using 'dd/mm/yy' dateformat for New Zealand dates. As soon as I select a date from the datepicker popup, the format in my textbox changes to mm/dd/yy Here is my code, can someone tell me what I am doing wrong please?? $(function () { $("#datepicker").datepicker({regional: "en-NZ"}); $("#datepicker").datepicker({dateFormat: 'dd/mm/yy'}); });
Cycle plugin blocks drop down menu items
I am not sure if I am alone. But when using Cycle plugin, whenever an image fade out, it will block drop down menu items from a UL above. For example: http://site1.ewart.library.ubc.ca/node/255 "Category" has drop down (sub) menu items and those sub menu items are constantly blocked. How to fix that, via CSS or JQuery? ie. change z-index of the slideshow items (or its parent DIV)? Thanks.
jQuery Watermark (light text hint over input fields)
What is Watermark? You have seen it in many websites! A watermark typically appears as light text within an input or textarea element whenever the element is empty and does not have focus. This provides a hint to the user as to what the input or textarea element is used for, or the type of input that is required. (Some watermarks such as this one can show the watermark as long as the first character is not entered). Those gray tips in below example are called watermarks This plugin is designed to
Possible to show last two pages side by side on larger viewport/screen sizes?
Using JQM for the first time and attempting to build a web app which has the standard 'single column' view on smaller viewports but a double (or even treble) column view on larger viewports by using responsive web design CSS. Is this possible with JQM? I can either have all the JQM 'pages' in a single HTML page or AJAX'd in (if that makes any difference)? For example: // 'mobile view' #page-1 page header list item list item list item list item // 'tablet+ view' #page-1 #page-2
Voiding a back button opens the pandorra's box at ready function ...
I am trying to disable the back button through a forward trick in a common include page. Now the forwarded page which depends on select functions through .ready is failing. How do I recognize the request as forwarded and open ready again?
onclick goto a URL...how?
Hey guys How do I complete this so that when a user clicks on on the div rollOver, it loads in a new html page into the current browser window. $('rollOver').click(function(){ // load URL index.php }); Thanks so much in advance Vic
script broken when change to 1.7 version
HI friends! I need your help... when I change to jquery new version (1.7), my menu script was broken, could anybody help me to fix it? thanks!! function mainmenu(){ // Oculto los submenus $("#nav ul").css({display: "none"}); // Defino que submenus deben estar visibles cuando se pasa el mouse por encima $(" #nav li").hover(function(){ $(this).find('ul:first:hidden').css({visibility: "visible",display: "none"}).slideDown(400); },function(){ $(this).find('ul:first').slideUp(400);
Help getting jquery.collapser to be collapsed by default...
Hi Everyone, I have only just started playing with JSQuery, but have managed to cobble together a semi working attempt at what I'd like to do. I am trying to make a webpage that has hidden tables by default, which can then be uncollapsed. I based it all on this tutorial site: http://www.aakashweb.com/resources/pages/demos/jquery-collapser/ I used Demo 3 as my starting point. In the attached zip file you will find the webpage which has collapsible elements in it (if you click the headers of each table
JQuery.get() -receive text and Javascript objects
Hi I have send data with <a href="javascript:void(0)">1</a> / Get. The script response from the site (url), but the javascript inside (like this <a href="javascript:void(0)">2</a> and other scripts) doesnt work.Someone has an idea how I can enable javascript/respone? Thank you! $(document).ready(function() { $('a').click(function(){ var that = this; $.get('url', {'page':$(that).text()}, function(data){ $('#div_id').html(data); }); }); });
Slide Up on click on body when the element is shown
This is my code I need to Slide up the menu when the user clicks on any part of the body. $('.show-menu').click(function(event) { event.preventDefault(); $(this).addClass('active'); $(this).next('.menu-filter').slideDown(300); }); if($('.menu-filter').is(':visible')){ $('body').click(function(event) { event.preventDefault(); $('.show-menu').removeClass('active'); $('.menu-filter').slideUp(300); }); }
Why does this work and not this (wrapInner() inside a function works but not standalone)
// This entire post is related to IE9 only. All other browsers work // this works if ($('.bttnnew').length) { $('.bttnnew').addClass('hasIcon').each(function(){ var content = $(this).html(); $(this).html('<span class=txtDesc>'+content+'</span><span class=iconHolder></span>'); }); };yields: <a href="..." class="bttnnew hasIcon"><span class="txtDesc">Default Button Text</span><span class="iconHolder"></span></a> // But this does NOT work // in IE 9 if ($('.bttnnew').length)
jScrollPane: scrollbar disappears
Use the pluguin JScrollPane to create a scrollbar within the site area. The content is dynamically generated and therefore need to enable autoReinitialise the plug so that it calculates the height of the content. Within this content is a series of anchors. To function, activated the hijackInternalLinks: true to the plugin capture these anchors. The problem now is that when I click the link that leads to a particular anchor, the scrollbar disappears.
prevent text area from being focussed when div is displayed
I have div, which is set to "display: none" via css. When a user pushes a button I make the div visible via .show(). The problem I'm having is that my iPhone 4S automatically focuses on the text area within this div when I show it and the iPhone's keyboard is displayed on the screen. Should using .show on the div bring the text area into focus? It doesn't seem like it should to me. Here's the div, with display set to none: <div id="message_sender" style="display: none"> <label for="messageText"><strong>Message:</strong></label>
rotator that works on desktop and pc
Hi I have been asked to make a site mobile friendly, and so am making it responsive - no problems there. however, the site has an image rotator on the front page that's made with flash, so I figured I'd replace that with a jquery affair. The site is coded in xhtml4.1 trans with css2. I am not sure what the best way to proceed for the image rotator is - I was hoping to get one jquery solution that works on iPhones, android etc as well as desktop. However, when I start my googling I discover that there
Custom select menu options not positioned under select
I am trying to use the custom select menu and finding that the options are displayed in a location far away from the select menu and label. I am using the custom select menu inside a dialog - not sure if that is what is causing the issue or not. I have the following code: <div data-role="fieldcontain"> <label class="ui-input-text">Contact</label> <div class="ui-div-contain"> <select name="user" id="user" data-native-menu="false"
Is there any {{while}} loop in JsRender? I
Is there any {{while}} loop in JsRender? I could find {{for}} loop but required while kind of loop Chirag
Moving an element
I have image that I want to move from one place to second place, I use animate and left, right or top. What I want is to kill in someway the element because when I moved it to the bottom for example I get scroll bars for X and Y because the screen is now too big, Who I can move element to any place that I want and save the screen size?
form elements in lists not theming
I have a list being generated and feed into a jquery mobile page via json. Each list element contains two select lists and each list has the data-role="fieldcontain" set. I'm also using: $('#qualslist').html(data); $("#qualslist").listview('refresh'); To add the list of the page and refresh it. This is theming the main list as expected, however the select lists aren't themeing, they just look like standard list elements. the json looks like: "<li data-role=\"fieldcontain\">GCSE Additional
jQuery animation glitch
Hello, I'm developing a portfolio for a client with animations using jQuery. The website is http://go4impact.com/site/index2.html The problem I'm having is that when you click on Client Samples >> Print, Graphics, Websites, Case Studies it starts an animation of sorts. If you click on the same tab again before the animation starts, it calls for the animation to be started again, which leaves the previous animation kind of glitchy and leaves a sort of "residue". How do I fix this? I've tried using
Next Page