Responsive Site plus using jQuery Mobile

[applejack]

Made this existing site responsive and uses jQuery mobile for page loading via ajax and to allow page transitions. If on a desktop besides seeing the transitions work from clicking the menu links you can swipe your mouse left or right on the centre page content to go back and forth.

Try submitting the contact form with out entering anything. On a touch device it uses a different transition when swiping. Also vertical text for the menu tabs when the device width is narrow.

http://www.mediterraneo-restaurant.co.uk

[applejack]

If anyone looked at this before now then I missed something in the responsive when copying across from the production site so it wasn't working correctly. Now all fixed.

[Wishbone]

When I make my screen smaller, I see a blank white area under the menu.. I have to scroll down to see the text. Chrome on Windows.

Looks nice, BTW.

[applejack]

That's because it uses an orientation reload which of course doesn't work on a desktop as well as a js routine depending upon the device width

Same for vertical text etc on older browsers etc. But that is what is great about doing mobile sites as they all in effect use modern browsers.

And thanks BTW.

[elkman]

Ok, now this has to be one of the coolest restaurant sites I have ever seen. I am going to have to try to work my way through this to see how you created all of the components!

Under the lunch menu I could only get the first 3 menu categories to display when viewed at 360pixels using Firefox. The other three don't seem to work. Could be just that I am viewing on a laptop using Firefox to adjust the screen size.

Elkman

[applejack]

Thanks Elkman

Could be just that I am viewing on a laptop using Firefox to adjust the screen size.

Correct to an extent though also maybe your version of Firefox. The mobile css etc is only meant for mobile / tablet and therefore mainly Safari in iOS and Chrome on Android.

[elkman]

Using the newest version of Firefox. Everything works perfectly in Safari.

Once again, just a great site. Could you post some of the modules you used to create this? I know how you did the menus.

[applejack]

The main module used is CGISimpleSmarty as each item in the dinner and wine menus is actually a different page which makes it easier for the client to add edit and delete each item as well as re-order it.

The more interesting stuff is in the coding and using jQuery mobile as well as other JS components.

[Zoorlat]

Great website! (And a great resturant as well )

[applejack]

Thanks Zoorlat you probably know it's sister restaurant as well in that case.

http://www.osteriabasilico.co.uk/

You local to Notting Hill ?