Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    May 2013
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Off Canvas layout, transition called by Java or CSS?

    Hi,

    I am creating a responsive website and want to implement an Off Canvas feature, such as (http://webdesign.tutsplus.com/tutori...nvas-patterns/)

    I have seen a lot of patterns out there with tutorials etc. What I would like two know is which version of creating an off canvas layout is going to be more stable and compatible across all devices and browsers, JavaScript or CSS3 for the click event and transition?

    Also if you use or have used an off canvas pattern which have you used / use (a tutorial would be appreciated).

    Please discuss, any and all advice and opinions are appreciated.

  • #2
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,957
    Thanks
    9
    Thanked 727 Times in 721 Posts
    Javascript will be much more supported. Have a look here for css3 support. You'll see that the problem browser is (wait for it...) IE.

    EDIT: Just to clarify, it's the sliding transition that isn't fully supported.
    Last edited by SB65; 05-09-2013 at 05:04 PM.
    Use the W3C HTML Validator and CSS Validator to check your code and Firebug to see what css is applied to an element
    Read Steve Krug's book Don't Make Me Think - essential reading on web usability
    I don't recommend much, but I do recommend Clook for UK web hosting

  • #3
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,919
    Thanks
    6
    Thanked 1,040 Times in 1,013 Posts
    Also the CSS 3 solution seems to be using non-semantic HTML just to achieve some visual effects which is not good practice. The best approach is still progressive enhancement which includes JavaScript.


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •