Back to site

iCarousel

Фабіа Zendhi Нагана ( http://zend.lojcomm.com.br )

iCarousel з'яўляецца адкрытым зыходным кодам (бясплатная) JavaScript інструмент для стварэння каруселі, як фішкі.

Маецца таксама на беларускім якія прадстаўляюцца Патрыцыя

індэкс:

  1. Індэкс
  2. Абстрактны
  3. Прыклады
  4. Сумяшчальнасць браўзэра
  5. Асаблівасці
  6. Карыстанне
  7. Ліцэнзія
  8. Спампаваць
  9. Гісторыя версій
  10. Каментарыі

анатацыя:

Адзін з самых распаўсюджаных праблем вэб-распрацоўшчык звычайна асобы, звязаныя з бесперапынна круціць фрагмент зместу. Гэта можа быць прэзентацыя загалоўкі, невялікія фрагменты навін ці спіс мініяцюр. Прыроды рэчаў круціцца не мае значэння, занадта шмат тут, таму што ўсе гэтыя віды прыкладанняў доля заўсёды тая ж ідэя: Паварот. Гэтая мэта можа быць дасягнута рознымі спосабамі, як згасанне і прагорткі. Ну вось iCarousel становіцца карыснай. Гэта адзін крок наперад, спрабуючы абагульніць усе гэтыя тыпы фішак падаючы багатае ўяўленне і робіць задачу лёгка зрабіць.

Прыклады:

сумяшчальнасць з браўзэрамі:

iCarousel сумяшчальныя і правераны ў Internet Explorer , Firefox (Mozilla і яго сябры), оперы і Safari (дзякуючы Kamicane для тэставання). Але ён павінен працаваць у іншых браўзэрах таксама ... Калі вы паспяхова знайсці іншы сумяшчальны браўзэр, калі ласка, дайце мне ведаць;)

Асаблівасці:

iCarousel цалкам наладжвальным. Вы можаце змяніць любы параметр па змаўчанні толькі initializating класа аб'екта ў JSON. Даступныя наступныя варыянты:

  • (Аб'ект) анімацыі
    • (Радок) (па змаўчанні "fadeNscroll", значэння: ["fadeNscroll», «скрутак», «знікаць»]).
    • (Радок) кірунку (па змаўчанні "налева", значэння: ["зверху", "налева"]) - неабходны толькі "пракруткі" тыпу.
    • (INT) сума (па змаўчанні 1) - колькасць прадметаў для пракруткі:: неабходныя толькі "пракруткі" тыпу.
    • (Функцыя) пераходу (па змаўчанні Fx.Transition.Cubic.easeInOut).
    • (INT) працягласць (па змаўчанні 500)
    • (Аб'екта) круцяцца
      • (Радок) (па змаўчанні "ручной", значэння: ["ручной", "аўто"]).
      • (INT) інтэрвал (па змаўчанні 5000 мс) - неабходны толькі "аўта" тыпу.
      • (Радок) OnMouseOver (па змаўчанні "стоп", значэння: ["стоп", "ісці"]) - неабходны толькі "аўта" тыпу.
  • (Аб'ект) пункта
    • (Радок) Klass (па змаўчанні "рэч")
    • (INT) памеру (па змаўчанні 100) - адпаведны памер вырабы:: неабходныя толькі "пракруткі" тыпу.
  • (Радок) idPrevious (па змаўчанні "папярэдні")
  • (Радок) idNext (па змаўчанні "побач")
  • (Радок) idToggle (па змаўчанні "пераключэнне")

Як выкарыстоўваць:

Перш за ўсё, iCarouse пабудаваны на MooTools v1.1, так як бібліятэкі не патрабуюцца.
Атрымаць MooTools на http://mootools.net і iCarousel тут . Выкарыстоўвайце IceBeat Packito бачыць MooTools залежнасцяў .
Пры сцэнары ў рукі, уключыць іх паміж «галавой» вызначэнне:

  1. < галава >  
  2. .  
  3. <!--// коды тут //-->  
  4. .  
  5.   < сцэнар  тып = "тэкст / JavaScript"  SRC = "JS / mootools.js" > </ скрыпт >  
  6.   < сцэнар  тып = "тэкст / JavaScript"  SRC = "JS / icarousel.js" > </ скрыпт >  
  7. .  
  8. <!--// і тут //-->  
  9. .  
  10. </ галавой >  
  11.       

Ініцыялізацыя iCarousel класа:

  1. новыя  iCarousel ( "кантэйнер" , {  
  2.     Анімацыя: {  
  3.         тыпу:  "знікаюць" ,  
  4.         Пераход: Fx.Transitions.linear,  
  5.         круціцца: {  
  6.             тыпу:  "аўто"  
  7.         }  
  8.     }  
  9. });  
  10.       

Вось-вось, па гэтай стаўцы Вы павінны быць у стане бачыць iCarousel стварэння навінавая стужка з элементамі з класам "элемент".

ліцэнзіі:

Гэты кавалак кода распаўсюджваецца пад Open Source ліцэнзіяй MIT, якая дазваляе выкарыстоўваць яго і змяніць яго ў любых абставінах. Больш падрабязна прачытаць ніжэй:

Ліцэнзія MIT

Copyright (C) 2007 Фабіа Zendhi Нагана - http://zend.lojcomm.com.br

Дазвол, пры ўмове, бясплатна, любому асобе, які атрымаў копію дадзенага праграмнага забеспячэння і спадарожнай дакументацыі ("Праграмнае забеспячэнне"), справа ў дачыненні да Праграмнага забеспячэння без абмежаванняў, у тым ліку без абмежавання права на выкарыстанне, капіяванне, змена, зліццё , публікаваць, распаўсюджваць, ліцэнзаваць, і / або продаж дзід Праграмнага забеспячэння, і каб асобы, якім Праграмнае забеспячэнне мэбляй, каб зрабіць гэта, пры выкананні наступных умоў:

Вышэй апавяшчэнне аб аўтарскіх правах і дадзенае дазвол павінна быць уключана ва ўсе копіі або істотныя часткі праграмнага забеспячэння.

ПРАГРАМНАЕ ЗАБЕСПЯЧЭННЕ ПРАДСТАЎЛЯЕЦЦА "ЯК ЁСЬЦЬ", БЕЗ ЯКІХ-НЕБУДЗЬ ГАРАНТЫЙ, відавочных АБО МАЮЦЦА НА ЎВАЗЕ, УКЛЮЧАЮЧЫ, АЛЕ НЕ АБМЯЖОЎВАЮЧЫСЯ, ГАРАНТЫІ ПРЫДАТНАСЦІ ДЛЯ ПЭЎНАЙ МЭТЫ І непарушаным. НІ Ў ЯКІМ РАЗЕ АЎТАРЫ ЦІ АЎТАРСКІХ ПРАВОЎ НЕ НЯСУЦЬ АДКАЗНАСЦІ ЗА ЛЮБЫЯ Прэтэнзіі, СТРАТЫ ЦІ АДКАЗНАСЦІ, незалежна ад дзейнага ДАГАВОРА, грамадзянскай правапарушэння ці інакш, ЗВЯЗАНЫЯ З, У ВЫНІКУ АБО У СУВЯЗІ З праграмнае забеспячэнне або ВЫКАРЫСТАННЯ АБО ІНШЫХ здзелкі з ПРАГРАМНАЕ ЗАБЕСПЯЧЭННЕ.

спампаваць:

iCarousel даступная ў фарматах ніжэй:

  • спакаваныя версіі: Ultra сціснуты варыянт (3.40KB) - гатовы да выкарыстання ", як яго" версіі.
  • Поўная версія: Поўная версія (8.60KB) - для распрацоўшчыкаў, якія неабходна змяніць або проста вывучаць.

Гісторыя версій:

05/22/2007: v1.001

  • [Зменена] (опцыя) animation.type [прагорткі -> fadeNscroll (па змаўчанні), у цяперашні час пракруткі не выгарае што-небудзь (вельмі хутка)]
  • [Паведамленні] (метад) Goto (індэкс) - выкарыстоўвайце iCarousel.goTo (п) для анімацыі у п-й элемент калекцыі элементаў
  • [Паведамленні] (падзеі) onClickPrevious, onClickNext, onPrevious, onNext, onGoTo
  • [Зменена] OnMouseOver: "стоп" паводзіны цяпер скідае таймер анімацыі на OnMouseEnter і пачаць усё нанова на OnMouseLeave
  • [Зменена] Прыклад я, каб праілюстраваць выкарыстанне onPrevious і onNext
  • [Зменена] Прыклад II, каб праілюстраваць выкарыстанне onClickPrevious і onClickNext
  • [Зменена] Прыклад V для ілюстрацыі новых OnMouseEnter, OnMouseLeave паводзіны
  • [Паведамленні] Прыклад VI, каб праілюстраваць выкарыстанне GoTo

2007/09/05: 1.0 - першы публічны рэліз

Published (Last edited): Jul 17 , source: http://zendold.lojcomm.com.br/icarousel/