반응형

http://jqueryui.com/slider/#side-scroll

 

jQuery UI

 

jQuery UI Demos

jQuery UI offers a combination of interaction, effects, widgets, utilities, and themes designed to work well together or on their own. Play with the demos, view the source,build a theme, read the API documentation and start using jQuery UI today.

Interactions

Interactions add basic mouse-based behaviors to any element. You can create sortable lists, resizable elements, drag & drop behaviors and more with just a few lines or code. Interactions also make great building blocks for more complex widgets and applications.

Widgets

Widgets are full-featured UI controls that bring the richness of desktop applications to the Web. All widgets provide a solid core with plenty of extension points for customizing behavior, as well as full theming support.

Effects

Effects add support for animating colors and class transitions, as well as providing several additional easings. In addition, a full suite of custom effects are available for use when showing and hiding elements or just to add some visual appeal.

Utilities

Utilities used by jQuery UI to build interactions and widgets.

반응형
저작자표시

'프로그래밍 > Script' 카테고리의 다른 글

[jQuery] 10+ jQuery Sticky Scroll Plugins  (0) 2013.03.27
[javascript] Knockout.js  (0) 2013.03.22
[Mobile] Choosing a mobile development strategy  (0) 2013.03.21
[javascript] Meteor - nodejs . meteor  (0) 2013.03.20
[jQuery] Collection of jQuery Drag and Drop Plugins  (0) 2013.03.20
반응형

Creating a Mobile Touch Slide Panel with JQuery

http://www.zackgrossbart.com/hackito/touchslider/

DOWNLOAD : https://github.com/zgrossbart/jstouchslide

This bar is boring on a computer, but it comes alive on a mobile device. Grab your iPad or Android device and take a look.

Drag your finger and the items move with you. They follow your speed and keep your momentum. Play with it a little. I’ll wait.

Get the
source code

The sliding touch panel only shows up on mobile platforms. With a mouse it feels clunky, but sliding with your finger just feels right.

This article shows you how to implement a sliding touch panel in JavaScript. jQuery is the only dependency of the touch slider. The rest is pure JavaScript and HTML. It runs fast, feels natural, and works on every mobile device with touch support.


Horizontal Slide View

This is a JavaScript implementation of a mobile style Horizontal Slide View.

Use your finger to drag it left and right to all of the items in the view.

Since this is JavaScript it works on every mobile device with touch support

and

it does a good job with pictures

Each cell of the slider is HTML so you can put anything you want in it

The slider works just like the native application sliders

It snaps each cell into place and supports momentum

Try dragging fast and watch the items fly by

Want to know how it works?

keep reading

↓


반응형
저작자표시

'프로그래밍 > Script' 카테고리의 다른 글

[javascript] loopedSlider  (0) 2011.06.24
[App] Episode - 아이패드용 매거진 Pleiades Corp.  (0) 2011.05.19
[javascript] iScroll-js  (0) 2011.05.10
[jQuery] jquery - carousel  (0) 2011.05.10
[javascript] carouslide - A highly adaptable jQuery plugin for creating carousels and slideshows  (0) 2011.05.10
반응형
A highly adaptable jQuery plugin for creating carousels and slideshows

download : http://code.google.com/p/carouslide/downloads/list

CarouSlide is an easy-to-implement, flexible yet powerful jQuery plugin that allows you to create a wide range of different carousel and slideshow implentations, from a small and semantic list of HTML content.

Some of its optional features include:

Three types of animation: fade, slide vertically and slide horizontally

  • Back/Next controls
  • Infinite horizontal scrolling
  • Timed/Automatic animations (including play/pause button)
  • Hover activation on navigation
  • Optional use of Easing plugin for animations
  • Adjustable animation timings
  • 9Kb (minified) file size

All you need to get going is: 

$(".CarouSlide").CarouSlide();




반응형
저작자표시

'프로그래밍 > Script' 카테고리의 다른 글

[javascript] iScroll-js  (0) 2011.05.10
[jQuery] jquery - carousel  (0) 2011.05.10
[javascript] jQuery 를 이용한 Carousel & Slide  (0) 2011.05.03
[javascript] Carousel - Step carousel  (0) 2011.05.03
[javascript] JSONP를 사용한 도메인 간 통신, Part 1: JSONP와 jQuery의 결합으로 강력한 매시업 빠르게 만들기  (0) 2011.04.28

+ Recent posts

티스토리툴바