Page 4 of 4 FirstFirst ... 234
Results 31 to 37 of 37
  1. #31
    Join Date
    Jun 2008
    Location
    Osprey, Florida
    Posts
    151
    Plugin Contributions
    14

    Default Re: Responsive Design: How to address differences between touchscreen and desktop dev

    Just stumbled upon Device.js. "Device.js makes it easy to write conditional CSS and/or JavaScript based on device operating system (iOS, Android, Blackberry, Windows, Firefox OS), orientation (Portrait vs. Landscape), and type (Tablet vs. Mobile)." Thought it may be of some use. I will for sure take a look at it once I'm done with my current project. Click here for more information.

  2. #32
    Join Date
    Feb 2012
    Location
    mostly harmless
    Posts
    1,809
    Plugin Contributions
    8

    Default Re: Responsive Design: How to address differences between touchscreen and desktop dev

    Quote Originally Posted by ultimate_zc View Post
    Just stumbled upon Device.js. "Device.js makes it easy to write conditional CSS and/or JavaScript based on device operating system (iOS, Android, Blackberry, Windows, Firefox OS), orientation (Portrait vs. Landscape), and type (Tablet vs. Mobile)." Thought it may be of some use. I will for sure take a look at it once I'm done with my current project. Click here for more information.
    The code in that script to detect orientation fails on desktop (FF, IE 9/10) and mobile (FF). Detection of orientation does appear to be working in Chrome...

    Mobile vs Desktop does appear to be working using that script in FF, IE, and Chrome. Do not have a "tablet" handy to test detection of "tablets".
    The glass is not half full. The glass is not half empty. The glass is simply too big!
    Where are the Zen Cart Debug Logs? Where are the HTTP 500 / Server Error Logs?
    Zen Cart related projects maintained by lhûngîl : Plugin / Module Tracker

  3. #33
    Join Date
    Jan 2007
    Location
    Los Angeles, California, United States
    Posts
    10,023
    Plugin Contributions
    32

    Default Re: Responsive Design: How to address differences between touchscreen and desktop dev

    Quote Originally Posted by lhungil View Post
    The code in that script to detect orientation fails on desktop (FF, IE 9/10) and mobile (FF). Detection of orientation does appear to be working in Chrome...

    Mobile vs Desktop does appear to be working using that script in FF, IE, and Chrome. Do not have a "tablet" handy to test detection of "tablets".
    Give me a URL, and I can tell ya..
    My Site - Zen Cart & WordPress integration specialist
    I don't answer support questions via PM. Post add-on support questions in the support thread. The question & the answer will benefit others with similar issues.

  4. #34
    Join Date
    Feb 2010
    Location
    Syracuse, NY
    Posts
    2,159
    Plugin Contributions
    17

    Default Re: Responsive Design: How to address differences between touchscreen and desktop dev

    Quote Originally Posted by DivaVocals View Post
    Found the emails.. the last word on this was that you were going the let me test your lightbox.. hint.. hint.. hint..
    I knew I posted this somewhere

    I used it for the product quick view feature in my THE PRESTA-WHO RESPONSIVE TEMPLATE FOR ZC 1.5.X

    Anyway - packaged and will email it to you.
    Website - Github. Like the ZCA Bootstrap 4 Template? Donations Welcome. Bootstrap Plugins?

  5. #35
    Join Date
    Jan 2007
    Location
    Los Angeles, California, United States
    Posts
    10,023
    Plugin Contributions
    32

    Default Re: Responsive Design: How to address differences between touchscreen and desktop dev

    Whoo hoo!!

    Quote Originally Posted by rbarbour View Post
    I knew I posted this somewhere

    I used it for the product quick view feature in my THE PRESTA-WHO RESPONSIVE TEMPLATE FOR ZC 1.5.X

    Anyway - packaged and will email it to you.
    My Site - Zen Cart & WordPress integration specialist
    I don't answer support questions via PM. Post add-on support questions in the support thread. The question & the answer will benefit others with similar issues.

  6. #36
    Join Date
    May 2006
    Location
    Montana
    Posts
    291
    Plugin Contributions
    20

    Default Re: Responsive Design: How to address differences between touchscreen and desktop dev

    Quote Originally Posted by DivaVocals View Post
    And this is similar to what I was speaking of when looking at Image Handler's image hover feature.. The image hover feature is admin configurable (on/off), but that doesn't mean it should be applied to all devices, in particular touchscreen devices. I've experimented with media queries. At first, this looked like the solution.. The issue I discovered in testing was that the media queries did not behave fully as I would like on some desktop devices. The media queries disabled the image hover on my 10" laptop, but not on my 10" tablet. Because the media queries only looked at dimensions this contributes to the difference in outcome. What I wanted was for the image hover code to be replaced with an onClick action but ONLY on tablets or phones. This would mean that on my 10" netbook the image hover should work, but on my 10" tablet it would not.

    So following your posts, I tried using php-mobile-detect to kill the onmouseover effect for mobile devices only. My initial syntax was incorrect, and with the help of a fellow Zenner (who hopefully very soon will take over Image Handler's care and upkeep), I now have a means to get Image Handler's image hover behaving as I wish. The image hover now works on my 10" netbook, but not on my 10" tablet or my smartphone.

    The point I'm really trying to make with this is that there is more than one way to skin a cat, and I'm a believer of finding the right solution to resolve your business problem. The more research and discussion I have on this topic, the more I am discovering that a combination of methods may be needed to get me the results I want. I think I will not be the only one to come to this conclusion..
    Would you be able to post the fix you used on image handler? I have a few sites that use IH4 with image hover turned on - and also have responsive templates. Had a customer say that the image hover showing up on her phone was a PIA!

    THANKS!

  7. #37
    Join Date
    Jan 2007
    Location
    Los Angeles, California, United States
    Posts
    10,023
    Plugin Contributions
    32

    Default Re: Responsive Design: How to address differences between touchscreen and desktop dev

    Quote Originally Posted by stellarweb View Post
    Would you be able to post the fix you used on image handler? I have a few sites that use IH4 with image hover turned on - and also have responsive templates. Had a customer say that the image hover showing up on her phone was a PIA!

    THANKS!
    My code ULTIMATELY was the wrong execution and caused other issues.. So I removed it from my client's site which is why I never shared it..

    A better way would be for using a conditional statement with the php-mobile-detect script to simply NOT load the javascript and CSS files which support the image hover.. When my time permits, I may experiment with what is needed..
    My Site - Zen Cart & WordPress integration specialist
    I don't answer support questions via PM. Post add-on support questions in the support thread. The question & the answer will benefit others with similar issues.

 

 
Page 4 of 4 FirstFirst ... 234

Similar Threads

  1. v151 Responsive templates: How to test actual look and feel in devices
    By honda2007 in forum Addon Templates
    Replies: 5
    Last Post: 1 Aug 2015, 06:27 PM
  2. v139h Differences between 1.3.9 and 1.5.1
    By jgold723 in forum Upgrading to 1.5.x
    Replies: 5
    Last Post: 18 Jul 2013, 04:42 PM
  3. ZJ Black - differences between IE and FF
    By metalball in forum Addon Templates
    Replies: 0
    Last Post: 26 May 2009, 08:55 AM
  4. Template differences between v1.2.7x and 1.3.7x?
    By bgourmet in forum Templates, Stylesheets, Page Layout
    Replies: 5
    Last Post: 20 Feb 2007, 12:19 AM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
disjunctive-egg
Zen-Cart, Internet Selling Services, Klamath Falls, OR