WorldWideScripts.net Delivering the best Add-Ons in more than 37 languages.

中文(简体), English, हिन्दी/हिंदी, Español/Castellano, العربية, Русский язык, Français, 中文 (台灣), বাংলা, Bahasa Indonesia, اردو, Português, Deutsch, Bahasa Melayu (بهاس ملايو‎), 日本語 (にほんご), فارسی, Italiano, తెలుగు, Türkçe, ગુજરાતી, Język polski/polszczyzna, Tiếng Việt, ಕನ್ನಡ, Українська мова, ไทย
JavaScript / Images and Media

Ken Burns Media Gallery / Slideshow

— Add-On till WorldWideScripts.net

Prenumerera på vårt foder för att hålla dig uppdaterad!

Nytt! Följ oss som du vill ha det!


Ken Burns Media Gallery / Slideshow - CodeCanyon Item for Sale

Ads

Ad: Bluehost hosting

Word Version

GALLERI stöder bilder, video, ljud inline Phone iPad kompatibla minut installation Ken Burns-effekten miniatyr navigation och mycket mer!

Uppdateringar

UPPDATERING 2 0,1 [14/06/2011]

  • lagt AutoHeight exempel + API-anrop

UPDATE 2 0,0 [2011/09/06]

  • fasta buggar
  • konverterade till Phoenix Gallery - samma galleri funktioner + mer
  • tillsatt miniatyr navigering

Introduktion

jQuery Ken Burns Slideshowis det perfekta sättet att visa upp dina bilder / annonser i stil. Varje objekt har en separat bildspel tid och du kan redigera deras länk, mål och många andra individuella inställningar bara genom att ändra HTML.

Funktioner

  • stöder.PNGs,.JPGs,.GIFs
  • API - ring paus, spela, gotoNext, gotoPrev från din html (utanför galleriet)
  • AutoHeight - möjlighet att autosize galleriet beroende på höjden av innehållet
  • stöder obegränsat poster - rotera så många bilder som du vill
  • bildspelsläge - oberoende tid för varje objekt som du kan definiera i HTML tillgänglig
  • värden du kan ställa in för varje post - beskrivning (beskrivningen uppifrån), initialZoom (något värde du vill), finalZoom, slideshowTime (den tid banner rotator förblir fokuserade på specifika objekt), bränna effekt tid (den tid du vill att effekten ska ta), url (om ingen url sätts objektet kommer bara vara en bild utan länk på klick), transitionType (easeInSine, linjär etc.), initialposition, slutliga position (välj från topLeft, topcenter, topright, middleleft, middlecenter, middleright, bottom, bottomcenter, bottom)
  • resizable till önskad storlek - allt innehåll kommer att placera korrekt

Möjliga vask positioner (inledande och avslutande)

FAQ

Så ställer du in antalet miniatyrbilder, jag har denna porträttbilder i reglaget.. navigerings visar endast två av dem, medan det finns utrymme för fyra?

Du kan inte ställa in antalet miniatyrbilder som visas per sidan "eftersom det beräknas automatiskt från tummen bredd / höjd och tummen utrymme. Så försök att sänka den för mer tummen. Det finns också en annan parameter "nav_arrow_size: 40" - detta är det utrymme som tilldelas för varje pil (så at default 80 px är subtraheras för pilar) och du kan också sänka denna för mer tummen.

är det möjligt att sätta en länk på bilderna (huvudbilden offcourse inte miniatyr) Ja, visst, skriver

 <a href="#"> <img src = "img / def1.jpg" /> </a> 

istället för

 <img src = "img / def1.jpg" /> 

Jag försöker att lägga till länkar i beskrivningen, men det bryter skriptet

Propably du gör något sånt här

BAD:

 data description = "Min länken är <a href="http://something"> här </a>" 

Problemet är att "insidan href bryter" från databeskrivning. Lösningarna är använda "istället för"

BRA:
 data description = "Mitt länken är <a href="http://something"> här </a>" 
Hej. Hur kan jag stoppa automatisk glidning phoenixgallery

du har i parametrarna

 targetgallery.phoenixgallery ({ transition_type: "random", nav_type: "thumbsa", nav_position: "upp", thumb_width: 100, thumb_height: 75, thumb_space: 20, nav_space: 25, nav_arrow_size: 40, settings_shadow: "off", settings_autoresize: "off", settings_autoheight: "off", settings_pauseonrollover: "off", settings_usethumbarrows: "off", transition_strips_x: 10, transition_strips_y: 5, arrows_normal_alpha: 1, arrows_roll_alpha: 0,3, thumbs_normal_alpha: 1, thumbs_roll_alpha: 0,3 }) 
att inaktivera bildspel bara lägga till en ny parameter settings_slideshow och ställ in den på off Gillar du
 targetgallery.phoenixgallery ({ transition_type: "random", nav_type: "thumbsa", nav_position: "upp", thumb_width: 100, thumb_height: 75, thumb_space: 20, nav_space: 25, nav_arrow_size: 40, settings_shadow: "off", settings_autoresize: "off", settings_autoheight: "off", settings_slideshow: "off", settings_pauseonrollover: "off", settings_usethumbarrows: "off", transition_strips_x: 10, transition_strips_y: 5, arrows_normal_alpha: 1, arrows_roll_alpha: 0,3, thumbs_normal_alpha: 1, thumbs_roll_alpha: 0,3 }) 
Av någon anledning när jag lägger till en länk till bilden zoomeffekt inte längre fungerar.

Det beror på att attributen data initialZoom, data finalZoom, data effectTime etc. måste vara den direkta barn galleriet div. Till exempel om du har

 

Effekten kommer att fungera, men om du lägger till länken så här
 <a href="#"> </a> 
effekt kommer inte att fungera. Du måste flytta attribut till den direkta barn i galleriet så här:
 <a href="#" data-finalzoom="2"> </a> 

Krediter

Kreativa bilder - http://www.flickr.com/photos/markjsebastian/

Hämta
Andra komponenter i denna kategoriAlla komponenter i denna författare
KommentarerVanliga frågor och svar

Egenskaper

Skapad:
2 Aug 10

Senaste uppdateringen:
N / A

Kompatibla webbläsare:
IE7, IE8, IE9, Firefox, Safari, Opera, Chrome

Filer Ingår:
JavaScript JS, HTML, CSS

Programvaruversion:
jQuery

Nyckelord

e-handel, e-handel, Alla artiklar, pilar, anpassad navigering, effekter, galleri, bild, Ken Burns, tal, pan, bilder stö, d, rotator, bildspel, miniatyrer, ö, vergå, ngar, videosupport, zoom