Designing By Ilya Birman, ilyabirman.net Declarative APIs - PowerPoint PPT Presentation


 
 Data a tu ributes data - spin 
 data - duration 
 data - spin - element 
 data - scale 
 data - continue 
 data - angle 
 data - await 
 data - origin 
 data - hold 
 data - expose 
 data - effect 
 data - opaque 
 data - up 
 data - style-1 
 data - down 
 data - style-2 
 data - left 
 data - emerge - event data - right


 Data a tu ributes <div class="fotorama emerge" data -��../ data -��../ data - effect ��../ ??? data -��../ data -��../ > ��../ �<0 div>


 Data a tu ributes data - emerge - spin 
 data - emerge - effect 
 data - emerge - continue


 Data a tu ributes <div class="emerge" data - effect= ��../ > 
 <div class="fotorama" data - effect= ��../ > ��../ �<0 div> 
 �<0 div>

Universal → Clean

Jouele 
 Audio player for the Web maintained by 
 Evgeniy 
 Lazarev

Jouele

<a href="yesterday.mp3">The Beatles: Yesterday �<0 a> The Beatles: Yesterday

<a href="yesterday.mp3" class="jouele">The Beatles: Yesterday �<0 a> The Beatles: Yesterday

<h1>The Beatles �<0 h1> <a href="yesterday.mp3" class="jouele">Yesterday �<0 a> <a href="letitbe.mp3" class="jouele">Let it be �<0 a> <a href="heyjude.mp3" class="jouele">Hey Jude �<0 a>

<h1>The Beatles �<0 h1> <div class="jouele - playlist"> <a href="yesterday.mp3" class="jouele">Yesterday �<0 a> <a href="letitbe.mp3" class="jouele">Let it be �<0 a> <a href="heyjude.mp3" class="jouele">Hey Jude �<0 a> �<0 div>

D E M O Unreleased


 How is it done?

<img ��../ class="jouele - control" 
 data - type="play - pause" 
 �/?

<tr class="jouele - control" 
 data - type="seek" 
 data - to="12 : 34" 
 > ��../�<0 tr>


 One-way control 1. Image controls the player 2. Table rows control the player


 Two-way control 1. Image controls the player 2. Table rows control the player 3. The player controls the image 4. The player controls the table rows