I am writing a jQuery Mobile single page application.
In one of my divs (data-role="page") I have a few images (img elements) which I load in "pagebeforeshow":
$('#a1').attr("src", "images/smile.png");
When I first navigate to this page (using changepage), the image is displayed correctly, but if i click back and press the link to this page again, the image is not displayed.
If I use window.location (instead of changepage), everything work fine, but then I cannot control the transition (slide, flip etc').
Any ideas why is this happening?
Thanks!
Try using pagebeforechange instead of pagebeforeshow
Related
I'm using Jquery Mobile in my website, and I have a page with popups. I don't directly navigate to this page, but I inject the content with Ajax :
$("#myDiv").html(data).enhanceWithin();
The problem is that occasionally, when the page is loading, the popups content appear for half a second on the screen and then disappear...
Is there a way to avoid that ?
I have made 3 different html pages and I set anchor as [data-ajax="false"] to move another page.
Is there any way to change the page when swipe left or right ?
Also How do I set page change transition ?
page1
page2
page3
Why not use SlideMe (http://slideme.luigiferraresi.it/) ?
There are many jQuery slideshow plugins and it is usually hard to decide which one is better.
SlideMe is a responsive jQuery slider. It is done using CSS3 and works smoothly even in IE7. It is easy to install and has full screen option.
I use this plugin (which I modified a little) and I'm satisfied.
Nicolas
I am using jQuery Mobile 1.3.0 RC1. I have a popup that I create programmatically at the bottom of my page and close after a few seconds using setTimeout (toast notification). It works very well, however if I happen to scroll the page while the popup is displayed, the popup gets scrolled too. I would like the popup not to move, i.e. stay in its position relative to the screen, not relative to the page. Is there a way to do that ?
I have tried playing with the data-position-to attribute in the HTML element, with the positionTo option of the "open" method, and tried placing the popup element inside a fixed transparent footer, none of these resulted in the desired behavior.
I had a similar problem last week. Finally solved it using modal dialog instead of popups.
For popups, I could find following.
$("#myPopup").on({
popupbeforeposition: function () {
$('.ui-popup-screen').off();
}
});
Which helped me in prevention of closing the dialog while user touched outside of popup. But scrolling issue was still there. So I changed all popups to modal dialogs. Hope it helps someone.
I m new to Jquery I have created example jquery mobile in this if back and login button is used once then next(>>) and prevoius(<<) button display the same page not that which is refferd using href tag. Before using Back button and login button it work fine afterusing those button it works abnormally.
edit and to view demo http://jsfiddle.net/khushbujoshi/JERG4/5/
DOM Element IDs are unique don't use them twice.
You don't need to do the page change on your own with jQuery. Let jQuery-mobile handle it.
I am having the link button and when i clicked on the link button the popup will be open (with in the page itself like a modalpopup. now i have to get the popup feel using jquery and inside the div text should come from database.
How is it possible for getting the message from the backend.
means open a div in a modal popup feel using jquery
or opens the html page in a popup in the same window using jquery
Thanks and Regards
Vara Prasad.M
Take a look at the Facebox jQuery plugin. It does pretty much exactly what you're asking for. For example you can have a link like this to some remote page like so
text
then just call the facebox plugin when your content is loaded like so
jQuery(document).ready(function($) {
$('a[rel*=facebox]').facebox()
});
and your content will render in a modal window. You can also take a look at Fancybox or ThickBox which provide very similar functionality.
There are two steps to your problem:
Open a modal popup using jQuery
Fetch server side content and display it in the modal dialog
Use jQuery Dialog (http://docs.jquery.com/UI/Dialog) for popping open a modal dialog, and then use jQuery load (http://api.jquery.com/load/) for loading the content from the server.
The server page you call will make the database query and output the contents to the response buffer.