What is Reddit's opinion of jQuery Mobile?

From 3.5 billion Reddit comments

jQuery mobile sucks at Usability 101. Just check out the demo (on a phone), when you click a menu item, it jumps to the top of the page before sliding the next page into view. Similar story when going back.

Sencha Touch is so much slicker and natural.

Don't rate this guy down, it's a fair enough question from someone who is totally new to this kind of development.

> I created a basic "app" with some buttons that did page transitions, and when I went to the website on my phone, it was a horrible user experience. it looked great, but the delay after pressing a button and "jerkiness" of the whole thing was pretty bad.

Have a look at the prefetch feature. See also HTML5 web app cacheing

> and that got me thinking, why even use jQuery mobile at all? might as well just build your app native so you get that nice user experience. it's not like making a menu-driven app is hard in Android or iOS. I'm not trying to bash this or anything, maybe there is a use-case that actually makes sense and I just haven't thought about it.

Well, of course native apps are usually going to be smoother (although if you do things properly web apps can come a lot closer than you think), it really all depends on your requirements. Maybe you want to support more platforms than just iOS/Android - Blackberry, Windows, Palm, Kindle, etc. Maybe you don't want or need the expense of developing and supporting native apps for all those platforms.

> the cross-platform benefit is totally not worth requiring internet connectivity. I suppose you could use a local webview object in your app, but then why wouldn't you just go pure native at that point...

You don't require internet connectivity. At least on iOS, you can install a web app to the homescreen, cache everything on the device, and it will run with no connection at all. Using a webview is exactly what cross platform SDKs like PhoneGap do.

The bigger question isn't what you do on the backend (asp.net or php), but what JavaScript/CSS solutions you use on the frontend or client-side.

Options to consider:

• jQuery Mobile
• Sencha Touch
• Twitter Bootstrap

I'm not sure if I understand the question. jQuery Mobile's default behavior is to load external pages via Ajax specifically to enable transitions (see here).

Just don't put the rel="external" or data-ajax="false" attributes on your links and you should see transitions between pages--even when they're in external files.

Just started hacking on JQM... I think the answer is yes. JQM has some very specific mark up for the framework work http://jquerymobile.com/demos/1.1.0/docs/about/getting-started.html

Also, I'm not sure how your current webapp works in terms of xhr scripts but JQM "hijax" all pages (xhr to load a page within a block called <div data-role="page"> ... </div>)

Actually you can create your apps in HTML(5) with Java Script and CSS. You can then use PhoneGap or similar tool to create an app for Android (and other mobile systems). Also have a look at jQueryMobile

In it self, it's just an API layer for access to device, like GPS, camera, contacts, etc. If you're building apps, you're probably gonna need another framework for gui, like Sencha Touch 2 or jQuery Mobile or countless others. I learned later ST2 has access to device itself so having it on top of Phonegap is a little redundant and I've been wondering lately what really is the purpose of Phonegap then ?

haha thanks for the laugh. If you really want to make mobile friendly webpages, jquerymobile is awesome. I've been starting to play around with it and love it.

Highly recommend checking it out: jquerymobile!

Well, I haven't worked with jq mobile yet, but from what I understand it is totally correct to load jquery itself and jquery mobile. ( Check Getting started, there you see them doing this as well)

Did you check if your selector is correct? What happens if you let your button just trigger an alert or something? I also haven't used phonegap, but there's a small item on jq mobile & phonegap here - might be worth a read if you didn't already read it...

Yeah this isn't really the place... but I would suggest looking into this: http://jquerymobile.com/

http://jquerymobile.com/test/docs/api/events.html

That should include some 'swiping' touch functionality, that you'll want; swipe to the left and drag the container div's to the right. You can use CSS animations for hardware accelerated (where supported) transitions as well.

I'm interested to know how this works out for you.

You might have more luck here: http://www.reddit.com/r/androiddev

Although I don't know if they do much in the way of android web apps.

Yea, jquery on mobile devices can be an issue. you might try to use http://jquerymobile.com/ for all the mobile related stuff. its pretty new, so it might be buggy, but it might work for what you need.

This looks promising! I totally didn't think about using a mobile framework for these controls (derp).

The implementation for multi select inputs looks like exactly what i'm looking for.

If I go that route I might have to ditch jqueryui in place of mobile to make things look more consistent across the entire user experience.

Thanks!

75% of landing a decent job is networking. If you haven't already, start attending local web developer meetups. After you spend some time connecting with peers, you should see opportunities coming to you.

But you're right that you should head to a supernode city if you want to turn it into a serious career. NYC (creative firms), Chicago (advertising/marketing firms), and San Francisco (app development startups) are your best bets.

Regarding JS ... I recommend going the mobile route if you want a skillset that will be in high demand within 1-2 years. Check out jQuery Mobile and other mobile JavaScript frameworks, maybe experiment by building some simple websites/apps.

and lastly check out this framework where you can develop for mobile in html, css and javascript http://jquerymobile.com/

..and you can compile them as applications here https://build.phonegap.com/ for your phone

Web apps are basically web sites optimized for smartphone and tablets usage (smaller screens) so you can use any IDE which allow creation of web sites. As for me - I create them in any Notepad-like editor with code highlight (either actual Notepad, PHPEd or Adobe's Dreamweaver for example) and to render a page I use local Apache installation (WAMP package for Windows has everything and works great).

note: there are great frameworks which allow easier creation of (better) web apps - such as jQuery Mobile - but they can be a bit too difficult with zero experience.

Look, what I'm saying is that no browser supports specifically targetting the Android back button - it doesn't exist (or at least I couldn't find any documentation for it). I've linked you to a few other solutions that do something along the lines of what you want, all of which were found by 10 seconds of googling - if you don't understand enough Javascript to implement them, and don't want to learn, then you're going to have to specify that you want to be handed a complete solution. You are in /r/learnjavascript, after all, not /r/writemejavascript. I'm a bit handicapped here, since I don't know how Android handles the back arrow, but I'll assume it works the same as the back button in desktop browsers.

Here's one (requires jQuery mobile) that triggers when the back button is pressed once (ie. browser goes one step back in history). Taken from previously linked thread:

$(window).on("navigate", function(ev, data){ if (data && data.state && data.state.direction) { if (data.state.direction === "back) { goBack(); } } });

Without redesigning the whole site it sounds like what you are looking for is some kind of user-agent based routing. So that 'mobile' users get one site and desktop users get a different one. You can absolutely take care of making your input controls look like whatever you want with mostly CSS and probably a little javascript. You should check out things like jQuery Mobile or bootstrap that provide a lot of pre-built themes for that kind of stuff. The budget for that is just that is just the time you spend on it so you'd be set there.

I'm going to give some different advice which you don't necessarily have to follow, but it's worth considering anyway!

You can kill 7 birds with one stone if you use PhoneGap and JQuery Mobile.

Basically you make everything using Javascript, HTML and CSS (although with JQuery mobile you don't need much CSS).

Why would you do this? Well first, I believe Javascript is much easier for beginners. Secondly, you can make your app once, and deploy it to any smartphone. And finally, you get to learn about web technologies which are handy to know these days. But mostly it's just easier.

If it's just an app with the webview then you are literally opening your website on an app minus the URL bar.

Phonegapp or titaninum are not webviews, they are apps coded in html5.

Also see http://jquerymobile.com/

Phonegap is probably your best bet. It basically takes a web application and wraps it in a mobile shell. The app is called a hybrid app and works really well.

You can build the app yourself using html5/js/css or use a framework like jQuery mobile. http://jquerymobile.com/

jQuery Mobile is a good framework for mobile-only designs, although I wouldn't quite call it "minmal" - but in my experience it delivers the best "app" feel than any other framework and isn't difficult to use. I cannot say, however, how well it will work with your planned build environment, so you'd need to do some research in that department.

jQuery Mobile actually has a lot more widgets than jQueryUI. It's another possibility if you need more widgets. Due to its focus on cross-browser support it works with all the major desktop browsers as well as mobile browsers.

I made a few webbased Apps for mobiles (cross platform stuff) - never did a native mobile app though - but when it comes to UI design this doesn't change anything with the right framework (I prefer http://jquerymobile.com/ for the frontend to make the app look & feel as native as possible with a web app).

I'm leaning towards suggesting jQuery Mobile for you.

I don't think Twitter Bootstrap is going to be what you want aesthetically. Its strong suit is displaying content in a responsive layout, but not really form elements or page transitions.

Sencha Touch would work, but might be overkill and extra difficult while not giving you much more than what jQuery Mobile would.

Check out their demos (on an iPad too) and see how they feel. Maybe there's a killer feature that one or the other has that makes the decision easier for you:

• Sencha Kitchen Sink - Forms
• jQuery Mobile Demo - Forms

Well it would kinda depend on the brand of beer, innit? You would need to use their colours to try match the application to the brand. Using their fonts etcetera.

Here's an example - I fiddled around with for a few minutes, trying to emulate Black Labels CI - I don't have much time available today but this took me about 4 minutes to get to. I didn't use their colour codes I just guessed at them. There should be more silver in the theme...

jQueryMobile ThemeRoller

I find that having a "light" and "dark" theme usually works best, and I usually use the lighter of the 2 to be the "main" swatch, and the darker one for things like dialog popups etc.

jQuery Mobile gets you most of the UI for essentially free. All you do is use some standard html lists, inputs, etc - and a data-role attribute on each can set the type of control - toggles, sliders, dialogs, etc.

Out of the box, jqmobile lets you set a data-theme attribute at the root or any other level to switch from a blue/grey/black/yellow theme. I got a little more advanced and customized all of the styling with their ThemeRoller - which is also quite easy to do.

I don't know what system you're thinking of, man, but it isn't jQuery Mobile. jQM has always been a plugin library / html framework that sits alongside jQuery standard. You can see it right here on the first public alpha's release page (scroll down to the downloads and look at the snippet). jQTouch also sits alongside jQuery.

Maybe you're thinking about how Sencha Touch re-implements ExtJS?

Sure. I started by following the PhoneGap Guide. Once I had the HelloWorld app working, I switched to the jQuery Mobile Framework, just because I've been using jQuery for a while. Both guides were really helpful, but I did get stuck a bunch of times. The Google SDK support documents helped there as well as a lot of googling for specific problems.

It was really frustrating at first, but get's a lot easier once you get familiar with eclipse (if you already know how to program).

my apologies for not knowing too much about this subject, but it looks like you might be able to fix this by setting 2 booleans to true within jQuery .. it looks like these are $.mobile.allowCrossDomainPages and $.support.cors

Let us know if this helps :-)

I found this @ http://jquerymobile.com/demos/1.0/docs/pages/phonegap.html

Check out Skeleton and jQuery Mobile.

Skeleton is super simple, but you may need to add a lot of styling to get it to look how you want. jQuery Mobile kind of takes over your application. But is pretty easily customizable with their ThemeRoller tool and looks great on mobile deceives.

If your site needs to look good on both a desktop and mobile device, I would recommend Skeleton, otherwise use jQuery Mobile.

Is there an online demo where I can test this? Something similar to the JQuery Mobile and Sencha Touch demo pages would be a great motivator for using LungoJS.

Check out jQuery mobile (docs ). This is a javascript library that helps you build a mobile-friendly UI. The resulting UI looks a lot like a mobile app, and is suitable for small screens. It helps if you learn jQuery first, and the learning curve can be steep if you are not used to javascript and DOM manipulation. There are some good introductory tutorials here.

hey, since you have a phone made some time this century, can you do me favor and tell me if the jquery mobile demo is still annoyingly sluggish?

█▀▀▀▀▀█ █▄█▀█ █ ▄ █▀▀▀▀▀█ █ ███ █ █▄ ███▀ █ ███ █ █ ▀▀▀ █ █▀▀ ▀▀█ █ ▀▀▀ █ ▀▀▀▀▀▀▀ █ █ █ █▄▀ ▀▀▀▀▀▀▀ ███ ▄█▀ ▀███▄▄▀█████▀▄ ██ ▄▀ █ ▄▀▀ ▄ █ █▄▄▀ ▀█▀ ▀ ▄█▄▄▄▀ ▀▀ █▄ ▄█ █▄ ▄█ ▀▀▄▄▀▄▀█ ▄▀▀▄ █▀▄▄▀▀▄▀▀ ▀ ▀▀▀ ▀▀▀ █ ▀██▄ █▀▀▀█ ▄▀▄ █▀▀▀▀▀█ ▄█▀▀█ ▄▄█ ▀ █▀ ▄▀ █ ███ █ ███▄▄ █▀█▀▀██▄▄ █ ▀▀▀ █ ██▀█▄▀▄█▄ ▄█ ▀▀ ▀▀▀▀▀▀▀ ▀▀▀ ▀ ▀ ▀▀ ▀ ▀

Damn. thx for letting me know.

If you have a sec, do either of these work? 1. http://jquerymobile.com/demos/1.0a4.1/ 2. http://jquerymobile.com/test/

The mobile web app is built using jQueryMobile, it may have an incompatibility with wp7.

You're welcome! We're already pushing ahead on mobile with jQuery Mobile: http://jquerymobile.com/

I'm really not sure what kinds of mobile web applications will be built - but I'm certainly excited to see what will come!

Wow that is kinda screwed up. What phone/OS version is that? I'm using jQuery Mobile, and this is the compatibility matrix: http://jquerymobile.com/gbs/

BTW thanks for taking the effort to post a screenshot!