zurb / orbit

454 stars 96 forks source link

cannot display caption orbit 1.4.0 #122

Closed goldalworming closed 11 years ago

goldalworming commented 11 years ago

I've looking for all source to display caption on orbit slider..

and http://www.zurb.com/playground/jquery_image_slider_plugin is the only one example that can work properly and I have no idea to make my orbit slider work..

this is my slider

       <span class="orbit-caption" id="slidercap0"><a href=""><p>Batik Warisan Budaya Indonesia</p></a></span>
       <span class="orbit-caption" id="slidercap1"><a href=""><p>iLight community</p></a></span>
       <span class="orbit-caption" id="slidercap2"><a href=""><p>Kesenian Wayang Golek</p></a>/span>

and this is my orbit js

jQuery(document).ready(function($) {

$('#featured').orbit({ animation: 'fade', // fade, horizontal-slide, vertical-slide, horizontal-push animationSpeed: 800, // how fast animations are timer: true, // true or false to have the timer advanceSpeed: 4000, // if timer is enabled, time between transitions pauseOnHover: false, // if you hover pauses the slider startClockOnMouseOut: false, // if clock should start on MouseOut startClockOnMouseOutAfter: 1000, // how long after MouseOut should the timer start again directionalNav: true, // manual advancing directional navs captions: true, // do you want captions? captionAnimation: 'fade', // fade, slideOpen, none captionAnimationSpeed: 800, // if so how quickly should they animate in bullets: false, // true or false to activate the bullet navigation bulletThumbs: false, // thumbnails for the bullets bulletThumbLocation: '', // location from this file where thumbs will be afterSlideChange: function(){} // empty function }); });

i've tried some tutorial but no one works

jartaud commented 11 years ago

I was facing the same problem, take a look at line 6 t.charAt(0)=="#"&&(t=t.substring(1,t.length)) for example you have defined a captionOne id for the data-caption on one image, so t = #captionOne, t.charAt(0)=="#" (true) && (stup!d &&/%%$$$&...). I think this is the culprit: (t=t.substring(1,t.length)).

Just replace substring(1, by substring(0 or comment the line out /&&(t=t.substring(1,t.length))/

Hope you'll understand my english!

1. setCaption:function(){
2.     var t=this.currentSlide().attr("data-caption"),n;
3.     if(!this.options.captions)return!1;
4.     if(t){
5.         if(e.trim(e(t).text()).length<1)return!1;
6.         t.charAt(0)=="#"&&(t=t.substring(1,t.length)) ,n=e(t).html(),this.$caption.attr("id",t).html(n);
7.         switch(this.options.captionAnimation){
8.             case"none":
9.                 this.$caption.show();
10.             break;
11.             case"fade":
12.                 this.$caption.fadeIn(this.options.captionAnimationSpeed);
13.             break;
14.             case"slideOpen":
15.                 this.$caption.slideDown(this.options.captionAnimationSpeed)
16.         }
17.     }else 
18.     switch(this.options.captionAnimation){
19.         case"none":
20.             this.$caption.hide();
21.         break;
22.         case"fade":
23.             this.$caption.fadeOut(this.options.captionAnimationSpeed);
24.         break;
25.         case"slideOpen":
26.             this.$caption.slideUp(this.options.captionAnimationSpeed)
27.     }
28. }
goldalworming commented 11 years ago

OK. it's absolutely work. I hope foundation will update it as soon as possible..