web-dev-qa-db-fra.com

Barre de défilement en forme de lion avec jQuery?

Quelqu'un connaît-il un plugin jQuery qui crée des barres de défilement de style Mac OS X Lion pour chaque navigateur?

Merci d'avance.

Edit: Voici une image pour les utilisateurs de Windows

enter image description here

49
Tronic

Antiscroll est probablement l'un des meilleurs plugins disponibles qui recréent les barres de défilement de Mac OS X Lion dans chaque navigateur.

Certaines des fonctionnalités super de Antiscroll:

  1. Fondu entrant et sortant
  2. La taille du conteneur peut être ajustée dynamiquement et les barres de défilement s'adapteront
  3. Prise en charge native des roues de souris, des trackpads et d'autres périphériques d'entrée
  4. Affiche les barres de défilement lors du survol
  5. Prise en charge IE7 +, Firefox 3+, Chrome, Safari, Opera

enter image description here

Démo: http://automattic.github.io/antiscroll/

42
Nathan

Choses intéressantes, j'ai écrit un plugin qui fait exactement cela. Cela s'appelle LionBars .

43
Nikolay Dyankov

nanoScroller.js est un plugin jQuery codé avec Coffeescript et il fait son travail: http://jamesflorentino.github.com/nanoScrollerJS/

13
Murat Çorlu

Le scrollpane Jquery Plugin est le plus proche que vous obtiendrez.

voir la démo losange .

Pour le rendre plus semblable à Lion, vous pouvez le personnaliser pour n'afficher la barre que lorsque la div de piste est survolée et assurez-vous d'utiliser la fonction animateEase.

Oh et pour extra Apple bonté changez la direction du défilement donc bas est haut et haut est bas :-)

3
Ash

Le jour de la sortie de Lion, j'aimais beaucoup la barre de défilement dans le système d'exploitation. Les navigateurs ont déjà une barre de défilement par défaut mais j'ai pensé à eux les utilisateurs de Windows;).

Il est encore en construction mais il pourrait vous aider: OSX Scroll

Basé sur tinyscrollbar mais j'ai fait quelques ajustements. Vous pouvez activer le masquage automatique (comme dans le système d'exploitation). Jetez un œil aux fichiers source.

J'espère que cela aide.

3
FinchSol

C'est une vieille question .. mais peut-être que quelqu'un est toujours intéressé par ma version:

Source: https://github.com/pixelass/customScrollBar

Exemple: http://pixelass.github.io/customScrollBar/

Ce plugin réplique en fait la barre de défilement plus précisément que antiscroll ou nicescroll .. etc.

Le plugin permet un contrôle total sur les barres de défilement (actuellement uniquement verticales) et ne nécessite pas mousewheel.js (comme la plupart des plugins). La suppression de cette dépendance était l'objectif principal de ma version.

Il écoute également l'événement de défilement (comme le fait l'antiscroll). Le fade-in et le redimensionnement en survol des barres de défilement étaient manquants sur tous les autres plugins que j'ai trouvés. Ma version comprend un exemple pour montrer comment obtenir cet effet.

Il existe des (pseudo-) écouteurs d'événements facultatifs "scrollEnded" "clicked" qui sont déclenchés lorsque le défilement de l'utilisateur est terminé ou lorsque la barre de défilement-pouce est cliquée.

Ce plugin permet également presque tous les styles et réglages imaginables de la barre de défilement, comme les flèches de clic (flèches haut-bas).

Alpha

Il s'agit toujours d'alpha (heure de publication), mais le développement se poursuivra au fil du temps.

2
user950658

Utilisez mon plugin: scrollYo

Il utilise une approche simple pour faire défiler l'intérieur de son propre élément. Vous n'avez donc pas besoin d'ajouter plus d'éléments pour le faire rouler.

1
silviomoreto

jScrollPane plus un peu de modification feraient l'affaire.

This est un tutoriel à ce sujet.

0
roxes

This on a des barres de défilement comme celles sur Mac et est très simple à installer. Vous pouvez essentiellement appliquer n'importe quelle peau que vous aimez avec css.

0
mattie

nanoscroller ou nicescroller serait une meilleure option pour un défilement fluide.

0
Ayush Rastogi