advanced code snippet search

Posted By

smartweb on 08/20/10


Tagged

slide photo galleries


Versions (?)

JCoverFlip

 / Published in: jQuery
 

jCoverFlip: permet de présenter les images et le contenu associé à un élément pour créer facilement des interfaces de type coverflow.\r\npermet de glisser ou cliquez sur la fonctionnalité de mettre en valeur en vedette des éléments de contenu sur demande par l\'utilisateur.

Expand | Embed | Plain Text 
  1. jQuery(document).ready(function(){
  2.                 jQuery('#flip').jcoverflip({
  3.                     current: 4,
  4.                     beforeCss: function(el, container, offset){
  5.                         return [$.jcoverflip.animationElement(el, {
  6.                             left: (container.width() / 2 - 268 - 110 * offset + 20 * offset) + 'px',
  7.                             bottom: '20px'
  8.                         }, {}), $.jcoverflip.animationElement(el.find('img'), {
  9.                             width: Math.max(10, 100 - 20 * offset * offset) + 'px'
  10.                         }, {})];
  11.                     },
  12.                     afterCss: function(el, container, offset){
  13.                         return [$.jcoverflip.animationElement(el, {
  14.                             left: (container.width() / 2 + 167 + 110 * offset) + 'px',
  15.                             bottom: '20px'
  16.                         }, {}), $.jcoverflip.animationElement(el.find('img'), {
  17.                             width: Math.max(10, 100 - 20 * offset * offset) + 'px'
  18.                         }, {})];
  19.                     },
  20.                     currentCss: function(el, container){
  21.                         return [$.jcoverflip.animationElement(el, {
  22.                             left: (container.width() / 2 - 150) + 'px',
  23.                             bottom: 0
  24.                         }, {}), $.jcoverflip.animationElement(el.find('img'), {
  25.                             width: '300px'
  26.                         }, {})];
  27.                     },
  28.                     change: function(event, ui){
  29.                         jQuery('#scrollbar').slider('value', ui.to * 12.5);
  30.                     }
  31.                 });
  32.  
  33.  
  34.                 jQuery('#scrollbar').slider({
  35.                     value: 50,
  36.                     stop: function(event, ui){
  37.                         if (event.originalEvent) {
  38.                             var newVal = Math.round(ui.value / 12.5);
  39.                             jQuery('#flip').jcoverflip('current', newVal);
  40.                             jQuery('#scrollbar').slider('value', newVal * 12.5);
  41.                         }
  42.                     }
  43.                 });
  44.             });

Report this snippet  

You need to login to post a comment.