recentpopularlog in

piperh : touch   42

You probably don’t need input type=“number”
why using type="number" isn't always a good idea on form input fields
webdesign  web  design  input  form  number  type  field  usability  ux  touch  screen  numeric 
6 weeks ago by piperh
Managing SVG Interaction With The Pointer Events Property — Smashing Magazine
about using pointer-events (the svg property) to control where clicks matter and where not
webdesign  web  design  pointer  events  click  touch  svg  ux  ui  effect 
may 2018 by piperh
Hammer.JS - Hammer.js
They say: add touch gestures to your webapp.
webdesign  web  design  mobile  touch  screen  gesture  tap  swipe  press  js  javascript  script 
february 2018 by piperh
Solving The Double Tap Issue on iOS Devices
Useful bit of jQuery to disable iOS double tap behaviour on touch screen (uses touchend event).
I couldn't use it on bcnprints 'cos it fucks up the fancybox zooming
webdesign  web  design  js  javascript  script  jquery  ios  single  double  tap  link  touch  screen 
february 2018 by piperh
Swiper - Most Modern Mobile Touch Slider
swipe capable slider - their own webpage is NOT responsive, though maybe the slider itself is, I don't know. Sliding action has a nice transition effect but not as great as they claim.
webdesign  web  design  swipe  touch  carousel  gallery  slide  slider  framework  js  javascript  script 
january 2018 by piperh
Flickity
slick flickable carousel for mouse and touch, vanilla js. Update to previous version that I think maybe I used somewhere
webdesign  web  design  carousel  flick  responsive  touch  tap  js  javascript  script  flickable 
july 2017 by piperh
lory
vanilla js slideshow. Can also use jQuery. Can accommodate multiple width slides.
They say: Touch enabled minimalistic slider, Hardware accelerated transitions.
webdesign  web  design  slider  slideshow  js  javascript  vanilla  touchscreen  touch  carousel  image  slide 
october 2016 by piperh
javascript - Prefered Alternative to OnMouseOver for touch - Stack Overflow
explanation of equivalence of click events, touch and hover, between mouse ui and touchscreen.
webdesign  web  design  click  hover  touch  touchscreen  equivalent  equivalence  mouse  ui  js  javascript 
july 2016 by piperh
How to deal with :hover on touch screen devices
useful code for adding 'no-touch' class to elements - so you can code for both touchscreen and mouse hover
webdesign  web  design  modernizr  touch  no-touch  touchscreen  hover  tap  drop-down  css  code  coding  responsive  menu  jquery  js  javascript 
january 2016 by piperh
joeldbirch/superfish · GitHub
not vanilla - requires jQuery. Dropdown menus for hover and touch
webdesign  web  design  menu  dropdown  query  js  javascript  hover  touch 
november 2015 by piperh
Sequence.js - The responsive CSS animation framework
They say: For creating sliders, presentations, banners, and other step-based applications. Nice actions and v smooth (though I don't understand why they say "for step-based applications"). You can control the transitions with your own css.
webdesign  web  design  gallery  slideshow  carousel  animation  swipe  touch  responsive  transition  js  transform  css 
august 2015 by piperh
jQuery Scrollify - Power steering for your scroll wheel
a jquery method for snap-to scrolling on one-page sites, for desktop and touch screen
webdesign  web  design  js  javascript  jquery  scroll  scrolling  snap  desktop  touch  screen 
june 2015 by piperh
Flickity
Could be just the thing for Tria responsive site.
Touch friendly, responsive slider carousel. Uses css and js - seems optional to use vanilla js or jquery. Allows flicking using mouse and cursor (though can't see when that would be a good idea).
webdesign  web  design  carousel  touch  touchscreen  screen  css  js  javascript  responsive  slider  gallery 
march 2015 by piperh
Creating responsive, touch-friendly carousels with Flickity | CSS-Tricks
a responsive, touch friendly carousel package - css and js. Could be good for Tria responsive site
webdesign  web  design  carousel  touch  touchscreen  screen  css  js  javascript  responsive  slider  gallery 
march 2015 by piperh
Sticky Captions Concept
possible for Mary's site, instead of current sliding code (which isn't touch-screen friendly)
webdesign  web  design  effect  slide  sliding  caption  transition  touch  screen  touchscreen  animation 
october 2014 by piperh
Home | Gael Ltd
dropdowns that work on touch screen though on desktop you must click top level item - doesn't work on hover
webdesign  web  design  example  menu  navigation  drop-down  dropdown  touch  screen 
september 2014 by piperh
Superfish - Suckerfish on 'roids
Not responsive but can be used with meanmenu to make it so, or surely you could make it responsive yourself, no? (its only in the css, surely). In the examples shown you can dismiss dropdown with touch elsewhere. On desktop dropdowns appear on hover
jquery  navigation  menu  css  javascript  js  dropdown  flyout  nav  keyboard  touch  superfish  suckerfish  screen  accessible 
july 2014 by piperh
Flawless clickable drop-down navigation
demo requires click to open dropdown, doesn't open on hover
webdesign  web  design  menu  hover  click  touchscreen  touch  jquery  dropdown  css  device 
july 2014 by piperh
Simple jQuery Drop Down Menu in WordPress | Scott Bolinger
the demo doesn't show dropdown on hover - requires click to open. But might be adaptable
webdesign  web  design  menu  hover  click  touchscreen  touch  jquery  dropdown  css  device 
july 2014 by piperh
James Barnett : Make CSS dropdown menus work on touch devices
haven't tested this, needs jQuery, but on the face of it looks straightforward
webdesign  web  design  menu  hover  click  touchscreen  touch  jquery  dropdown  css  device 
july 2014 by piperh
Drop-Down Navigation: Responsive and Touch-Friendly — Osvaldas Valutis
a tap outside the drop-down will dismiss it. Also you can toggle the menu symbol on touch screen. Script is short, but requires jquery. Actually it's clunky on the mobile and not good for aria.
navigation  menu  css  responsive  mobile  touch  screen  tap  hover  dropdown  web  design  webdesign 
june 2014 by piperh
Image Lightbox: Responsive and Touch-Friendly demo by Osvaldas Valutis
simple lightbox with a few configuration options. Responsive and swipeable. Images appear as modal window
webdesign  web  design  jquery  lightbox  slideshow  gallery  swipe  swipeable  touch  responsive  mobile 
may 2014 by piperh
WOW Slider : jQuery Image Slider & Gallery
impressive-looking image slider, does everything, even claims to work without script. Probably big files, but there are some nice fancy effects
jquery  slideshow  javascript  gallery  slider  web  design  webdesign  image  css  responsive  touch  swipe 
november 2012 by piperh

Copy this bookmark:





to read