Inizio Interfaccia utente sul blog (YUIBlog)

Skin alternativa per YUI 3.1.0 Slider

Abbiamo deciso di prendere la YUI 3 Slider pelli widget su una tacca visivo per YUI 3.1.0. Questi erano i nostri obiettivi:

1. Migliorare la bontà visiva globale e 3-D aspetto
2. Offrire una gamma più ampia di pelli pollice e ferroviario
3. Forniscono due set di pelli di servire scure così come sfondi delle pagine luce
4. Fornire un set completo di pollici e guide per l'uso verticale e orizzontale
5. Rendere più facile combinare pollici con stili di guida diversi
6. Attività fornite Photoshop per aiutare gli sviluppatori a modificare le immagini scorrimento per adattarsi a qualsiasi colore di sfondo

Confrontare il 2 pelli cursore YUI con i 3 YUI sotto. La nuova serie ha più varietà e dovrebbe servire un ampio spettro di pagine e stili.

YUI 2 Slider Skin:

YUI 3 Slider Skin:

Non abbiamo limitare i pollici a rettangoli e angoli di 45 gradi. Questo pone alcune sfide con anti-aliasing. Il 2 pollici YUI sono ombre incorporati nella immagine pollice, quindi sono un grigio colore solido. Abbiamo migliorato questo facendo un oggetto ombra che è separata dall'immagine del pollice. L'ombra ha opacity: 0.15 . Questo significa che sembra naturale, come l'ombra cade sulla ferrovia e segni di graduazione.

Forniremo file originali photoshop contenenti ciascuna delle immagini ferroviario e il pollice. Ciò fornirà agli sviluppatori la fonte da cui di personalizzare facilmente le immagini in modo che apparire al meglio quando vengono immesse in qualsiasi colore di sfondo il vostro sito ha.

YUI 3 è widget fondazione GA stato raggiunto la scorsa settimana con il rilascio di YUI 3.1.0 . Non abbiamo ancora una serie completa di natale YUI 3 widget, e non abbiamo ancora definito una serie di skin globale. Tuttavia, il lavoro che abbiamo fatto sul patrimonio visivo per la componente Slider beta dovrebbe renderlo più utile nel breve periodo, e noi provvederemo a realizzare tutte queste opzioni visiva su temi come alternativa o una volta gli esempi YUI tre temi di riferimento sono in atto .

Date un'occhiata a questi esempi di codice di lavoro dei cursori nuovo. Acquista il dietro le quinte lavorazioni dettagliata delle immagini della pelle e CSS.

Ci auguriamo che questi nuovi cursori sarà una bella aggiunta visivo per la borsa di trucchi.

Trova conversazioni: Bloglines | technorati

Condividere ed estendere: Bookmark con del.icio.us | Digg it! | reddit!