diff --git a/documentation-assets/docs.css b/documentation-assets/docs.css index 87abbdb..6385a7b 100644 --- a/documentation-assets/docs.css +++ b/documentation-assets/docs.css @@ -32,15 +32,17 @@ color: #555; text-decoration: none; font-weight: bold; - padding: 3px 8px; + padding: 3px 8px 4px; position: relative; right: -8px; -moz-border-radius: 2px; - -webkit-border-radius: 2px; - border-radius: 2px; } + -webkit-border-radius: 2px; + border-radius: 2px; } +/* nav ul li a:hover { color: #fff; - background: #222; } + background: #333; } +*/ nav .button { float: right; } header h1 { @@ -116,7 +118,7 @@ #viewOnGithub { margin-bottom: 20px; - font-size: 12px; + font-size: 11px; color: #999; display: block; } diff --git a/index.html b/index.html index 5293f51..ae886dc 100644 --- a/index.html +++ b/index.html @@ -175,9 +175,8 @@

Buttons

-

Button are intended for action and thus should have appropriate weight. The standard buttons are given that weight by being strong and dark, but they could just as easily be colorful.

- Save Now - Dismiss Changes +

Buttons are intended for action and thus should have appropriate weight. The standard button is given that weight with a little bit of depth and a strong hover.

+ Click Me For Action
Code Example @@ -241,8 +240,7 @@ Regular Radio - - +
diff --git a/src/stylesheets/base.css b/src/stylesheets/base.css index 1265133..3260463 100644 --- a/src/stylesheets/base.css +++ b/src/stylesheets/base.css @@ -124,31 +124,46 @@ /* #Buttons ================================================== */ - - .button { - background: #222; - display: inline-block; - padding: 9px 34px 11px; - color: #fff !important; - text-decoration: none; - font-weight: bold; - line-height: 1; - position: relative; - cursor: pointer; - -moz-border-radius: 2px; - -webkit-border-radius: 2px; - border-radius: 2px; - font-size: 12px; - line-height: 12px; - font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; - border: none; - margin-bottom: 20px; - } - .button.square { - -moz-border-radius: none; - -webkit-border-radius: none; - border-radius: none; } + a.button, + button { + background: #eee; /* Old browsers */ + background: -moz-linear-gradient(top, rgba(255,255,255,.2) 0%, rgba(0,0,0,.2) 100%); /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.2)), color-stop(100%,rgba(0,0,0,.2))); /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* Opera11.10+ */ + background: -ms-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* IE10+ */ + background: linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* W3C */ + border: 1px solid #aaa; + border-top: 1px solid #ccc; + border-left: 1px solid #ccc; + padding: 4px 12px; + -moz-border-radius: 3px; + -webkit-border-radius: 3px; + border-radius: 3px; + color: #444; + display: inline-block; + font-size: 11px; + font-weight: bold; + text-decoration: none; + text-shadow: 0 1px rgba(255, 255, 255, .75); + cursor: pointer; + margin-bottom: 20px; + line-height: 21px; } + + a.button:hover, + button:hover { + color: #222; + background: #eee; /* Old browsers */ + background: -moz-linear-gradient(top, rgba(255,255,255,.3) 0%, rgba(0,0,0,.3) 100%); /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.3)), color-stop(100%,rgba(0,0,0,.3))); /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* Opera11.10+ */ + background: -ms-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* IE10+ */ + background: linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* W3C */ + border: 1px solid #888; + border-top: 1px solid #aaa; + border-left: 1px solid #aaa; } .button.full-width { width: 100%; @@ -156,19 +171,6 @@ padding-right: 0 !important; text-align: center; } - /* Sizes ---------- */ - .small.button { font-size: 11px; padding: 8px 20px 10px; } - .medium.button { font-size: 12px; } - .large.button { font-size: 18px; padding: 11px 48px 13px; } - - /* Types ---------- */ - .secondary.button { background-color: #aaa; font-size: 11px; } - - /* Hovers ---------- */ - .button:hover { background-color: #000; } - .secondary.button:hover { background-color: #777; } - - /* #Tabs (activate in app.js) ================================================== */ @@ -189,7 +191,7 @@ text-decoration: none; width: auto; height: 29px; - padding: 0px 16px; + padding: 0px 20px; line-height: 30px; border: solid 1px #ddd; border-width: 1px 0 0 1px; @@ -259,7 +261,8 @@ display: block; margin-bottom: 20px; background: #fff; } - input:focus { + input:focus, + textarea:focus { border: 1px solid #aaa; color: #444; -moz-box-shadow: 0 0 3px rgba(0,0,0,.2); diff --git a/src/stylesheets/skeleton.css b/src/stylesheets/skeleton.css index 82af841..f7173ac 100644 --- a/src/stylesheets/skeleton.css +++ b/src/stylesheets/skeleton.css @@ -52,6 +52,9 @@ which applies to mobile as well.*/ .container .fifteen.columns { width: 880px; } .container .sixteen.columns { width: 940px; } + .container .one-third.column { width: 300px; } + .container .two-thirds.column { width: 620px; } + /* Offsets */ .container .offset-by-one { padding-left: 60px; } .container .offset-by-two { padding-left: 120px; } @@ -71,80 +74,6 @@ which applies to mobile as well.*/ - - -/* #Responsive: Fluid Grid for Downscaling -================================================== */ - - /* NOTE: Cannot be used with nested columns. */ - -/* - @media screen and (min-device-width: 789px) and (max-width: 959px) { - .fluid960.container { - width: 100%; - min-width: 320px; } - .fluid960.container .column, - .fluid960.container .columns { margin-left: 1%; margin-right: 1%; } - - .fluid960.container .one.column { width: 4.25%; } - .fluid960.container .two.columns { width: 10.5%; } - .fluid960.container .three.columns { width: 16.75%; } - .fluid960.container .four.columns { width: 23%; } - .fluid960.container .five.columns { width: 29.25%; } - .fluid960.container .six.columns { width: 35.5%; } - .fluid960.container .seven.columns { width: 41.75%; } - .fluid960.container .eight.columns { width: 48%; } - .fluid960.container .nine.columns { width: 54.25%; } - .fluid960.container .ten.columns { width: 60.5%; } - .fluid960.container .eleven.columns { width: 66.75%; } - .fluid960.container .twelve.columns { width: 73%; } - .fluid960.container .thirteen.columns { width: 79.25%; } - .fluid960.container .fourteen.columns { width: 85.5%; } - .fluid960.container .fifteen.columns { width: 91.75%; } - .fluid960.container .sixteen.columns { width: 98%; } - } -*/ - - - - -/* #Responsive: Fully Fluid Grid -================================================== */ - - /* NOTE: Cannot be used with nested columns. */ - -/* - .fluid.container { - width: 100%; - min-width: 320px; } - .fluid.container .column, - .fluid.container .columns { margin-left: 1%; margin-right: 1%; } - - .fluid.container .one.column { width: 4.25%; } - .fluid.container .two.columns { width: 10.5%; } - .fluid.container .three.columns { width: 16.75%; } - .fluid.container .four.columns { width: 23%; } - .fluid.container .five.columns { width: 29.25%; } - .fluid.container .six.columns { width: 35.5%; } - .fluid.container .seven.columns { width: 41.75%; } - .fluid.container .eight.columns { width: 48%; } - .fluid.container .nine.columns { width: 54.25%; } - .fluid.container .ten.columns { width: 60.5%; } - .fluid.container .eleven.columns { width: 66.75%; } - .fluid.container .twelve.columns { width: 73%; } - .fluid.container .thirteen.columns { width: 79.25%; } - .fluid.container .fourteen.columns { width: 85.5%; } - .fluid.container .fifteen.columns { width: 91.75%; } - .fluid.container .sixteen.columns { width: 98%; } -*/ - - -/* #Responsive: Go Mobile -================================================== */ - - /* NOTE: These styles mimic mobile styles in browser */ - - /* #Responsive: iPad Portrait ================================================== */ @@ -174,6 +103,9 @@ which applies to mobile as well.*/ .container .fifteen.columns { width: 700px; } .container .sixteen.columns { width: 748px; } + .container .one-third.column { width: 236px; } + .container .two-thirds.column { width: 492px; } + /* Offsets */ .container .offset-by-one { padding-left: 48px; } .container .offset-by-two { padding-left: 96px; } @@ -217,7 +149,9 @@ which applies to mobile as well.*/ .container .thirteen.columns, .container .fourteen.columns, .container .fifteen.columns, - .container .sixteen.columns { width: 300px; } + .container .sixteen.columns, + .container .one-third.column, + .container .two-thirds.column { width: 300px; } /* Offsets */ .container .offset-by-one, @@ -263,7 +197,9 @@ which applies to mobile as well.*/ .container .thirteen.columns, .container .fourteen.columns, .container .fifteen.columns, - .container .sixteen.columns { width: 420px; } + .container .sixteen.columns, + .container .one-third.column, + .container .two-thirds.column { width: 420px; } } diff --git a/test-one.html b/test-one.html new file mode 100644 index 0000000..f24be5c --- /dev/null +++ b/test-one.html @@ -0,0 +1,92 @@ + + + + + + + + + + + Skeleton: Test One + + + + + + + + + + + + + + + + + + + + + + +
+ +
+
+ slider + slider +
+
+
+ +
Title
+

Skeleton has a familiar, lightweight 960 grid as it's base, but elegantly scales down to downsized browser windows, tablets, mobile phones (in landscape and portrait). Go ahead, resize this page!

+
+
+ +
Title
+

Skeleton has a familiar, lightweight 960 grid as it's base, but elegantly scales down to downsized browser windows, tablets, mobile phones (in landscape and portrait). Go ahead, resize this page!

+
+
+ +
Title
+

Skeleton has a familiar, lightweight 960 grid as it's base, but elegantly scales down to downsized browser windows, tablets, mobile phones (in landscape and portrait). Go ahead, resize this page!

+
+
+ + + + + + + + + + + + + \ No newline at end of file diff --git a/test/test-one/jquery.nivo.slider.pack.js b/test/test-one/jquery.nivo.slider.pack.js new file mode 100755 index 0000000..5a42114 --- /dev/null +++ b/test/test-one/jquery.nivo.slider.pack.js @@ -0,0 +1,67 @@ +/* + * jQuery Nivo Slider v2.5.1 + * http://nivo.dev7studios.com + * + * Copyright 2011, Gilbert Pellegrom + * Free to use and abuse under the MIT license. + * http://www.opensource.org/licenses/mit-license.php + * + * March 2010 + */ + +(function($){var NivoSlider=function(element,options){var settings=$.extend({},$.fn.nivoSlider.defaults,options);var vars={currentSlide:0,currentImage:'',totalSlides:0,randAnim:'',running:false,paused:false,stop:false};var slider=$(element);slider.data('nivo:vars',vars);slider.css('position','relative');slider.addClass('nivoSlider');var kids=slider.children();kids.each(function(){var child=$(this);var link='';if(!child.is('img')){if(child.is('a')){child.addClass('nivo-imageLink');link=child;} +child=child.find('img:first');} +var childWidth=child.width();if(childWidth==0)childWidth=child.attr('width');var childHeight=child.height();if(childHeight==0)childHeight=child.attr('height');if(childWidth>slider.width()){slider.width(childWidth);} +if(childHeight>slider.height()){slider.height(childHeight);} +if(link!=''){link.css('display','none');} +child.css('display','none');vars.totalSlides++;});if(settings.startSlide>0){if(settings.startSlide>=vars.totalSlides)settings.startSlide=vars.totalSlides-1;vars.currentSlide=settings.startSlide;} +if($(kids[vars.currentSlide]).is('img')){vars.currentImage=$(kids[vars.currentSlide]);}else{vars.currentImage=$(kids[vars.currentSlide]).find('img:first');} +if($(kids[vars.currentSlide]).is('a')){$(kids[vars.currentSlide]).css('display','block');} +slider.css('background','url("'+vars.currentImage.attr('src')+'") no-repeat');slider.append($('

').css({display:'none',opacity:settings.captionOpacity}));var processCaption=function(settings){var nivoCaption=$('.nivo-caption',slider);if(vars.currentImage.attr('title')!=''){var title=vars.currentImage.attr('title');if(title.substr(0,1)=='#')title=$(title).html();if(nivoCaption.css('display')=='block'){nivoCaption.find('p').fadeOut(settings.animSpeed,function(){$(this).html(title);$(this).fadeIn(settings.animSpeed);});}else{nivoCaption.find('p').html(title);} +nivoCaption.fadeIn(settings.animSpeed);}else{nivoCaption.fadeOut(settings.animSpeed);}} +processCaption(settings);var timer=0;if(!settings.manualAdvance&&kids.length>1){timer=setInterval(function(){nivoRun(slider,kids,settings,false);},settings.pauseTime);} +if(settings.directionNav){slider.append('
'+settings.prevText+''+settings.nextText+'
');if(settings.directionNavHide){$('.nivo-directionNav',slider).hide();slider.hover(function(){$('.nivo-directionNav',slider).show();},function(){$('.nivo-directionNav',slider).hide();});} +$('a.nivo-prevNav',slider).live('click',function(){if(vars.running)return false;clearInterval(timer);timer='';vars.currentSlide-=2;nivoRun(slider,kids,settings,'prev');});$('a.nivo-nextNav',slider).live('click',function(){if(vars.running)return false;clearInterval(timer);timer='';nivoRun(slider,kids,settings,'next');});} +if(settings.controlNav){var nivoControl=$('
');slider.append(nivoControl);for(var i=0;i');}else{nivoControl.append('');}}else{nivoControl.append(''+(i+1)+'');}} +$('.nivo-controlNav a:eq('+vars.currentSlide+')',slider).addClass('active');$('.nivo-controlNav a',slider).live('click',function(){if(vars.running)return false;if($(this).hasClass('active'))return false;clearInterval(timer);timer='';slider.css('background','url("'+vars.currentImage.attr('src')+'") no-repeat');vars.currentSlide=$(this).attr('rel')-1;nivoRun(slider,kids,settings,'control');});} +if(settings.keyboardNav){$(window).keypress(function(event){if(event.keyCode=='37'){if(vars.running)return false;clearInterval(timer);timer='';vars.currentSlide-=2;nivoRun(slider,kids,settings,'prev');} +if(event.keyCode=='39'){if(vars.running)return false;clearInterval(timer);timer='';nivoRun(slider,kids,settings,'next');}});} +if(settings.pauseOnHover){slider.hover(function(){vars.paused=true;clearInterval(timer);timer='';},function(){vars.paused=false;if(timer==''&&!settings.manualAdvance){timer=setInterval(function(){nivoRun(slider,kids,settings,false);},settings.pauseTime);}});} +slider.bind('nivo:animFinished',function(){vars.running=false;$(kids).each(function(){if($(this).is('a')){$(this).css('display','none');}});if($(kids[vars.currentSlide]).is('a')){$(kids[vars.currentSlide]).css('display','block');} +if(timer==''&&!vars.paused&&!settings.manualAdvance){timer=setInterval(function(){nivoRun(slider,kids,settings,false);},settings.pauseTime);} +settings.afterChange.call(this);});var createSlices=function(slider,settings,vars){for(var i=0;i').css({left:(sliceWidth*i)+'px',width:(slider.width()-(sliceWidth*i))+'px',height:'0px',opacity:'0',background:'url("'+vars.currentImage.attr('src')+'") no-repeat -'+((sliceWidth+(i*sliceWidth))-sliceWidth)+'px 0%'}));}else{slider.append($('
').css({left:(sliceWidth*i)+'px',width:sliceWidth+'px',height:'0px',opacity:'0',background:'url("'+vars.currentImage.attr('src')+'") no-repeat -'+((sliceWidth+(i*sliceWidth))-sliceWidth)+'px 0%'}));}}} +var createBoxes=function(slider,settings,vars){var boxWidth=Math.round(slider.width()/settings.boxCols);var boxHeight=Math.round(slider.height()/settings.boxRows);for(var rows=0;rows').css({opacity:0,left:(boxWidth*cols)+'px',top:(boxHeight*rows)+'px',width:(slider.width()-(boxWidth*cols))+'px',height:boxHeight+'px',background:'url("'+vars.currentImage.attr('src')+'") no-repeat -'+((boxWidth+(cols*boxWidth))-boxWidth)+'px -'+((boxHeight+(rows*boxHeight))-boxHeight)+'px'}));}else{slider.append($('
').css({opacity:0,left:(boxWidth*cols)+'px',top:(boxHeight*rows)+'px',width:boxWidth+'px',height:boxHeight+'px',background:'url("'+vars.currentImage.attr('src')+'") no-repeat -'+((boxWidth+(cols*boxWidth))-boxWidth)+'px -'+((boxHeight+(rows*boxHeight))-boxHeight)+'px'}));}}}} +var nivoRun=function(slider,kids,settings,nudge){var vars=slider.data('nivo:vars');if(vars&&(vars.currentSlide==vars.totalSlides-1)){settings.lastSlide.call(this);} +if((!vars||vars.stop)&&!nudge)return false;settings.beforeChange.call(this);if(!nudge){slider.css('background','url("'+vars.currentImage.attr('src')+'") no-repeat');}else{if(nudge=='prev'){slider.css('background','url("'+vars.currentImage.attr('src')+'") no-repeat');} +if(nudge=='next'){slider.css('background','url("'+vars.currentImage.attr('src')+'") no-repeat');}} +vars.currentSlide++;if(vars.currentSlide==vars.totalSlides){vars.currentSlide=0;settings.slideshowEnd.call(this);} +if(vars.currentSlide<0)vars.currentSlide=(vars.totalSlides-1);if($(kids[vars.currentSlide]).is('img')){vars.currentImage=$(kids[vars.currentSlide]);}else{vars.currentImage=$(kids[vars.currentSlide]).find('img:first');} +if(settings.controlNav){$('.nivo-controlNav a',slider).removeClass('active');$('.nivo-controlNav a:eq('+vars.currentSlide+')',slider).addClass('active');} +processCaption(settings);$('.nivo-slice',slider).remove();$('.nivo-box',slider).remove();if(settings.effect=='random'){var anims=new Array('sliceDownRight','sliceDownLeft','sliceUpRight','sliceUpLeft','sliceUpDown','sliceUpDownLeft','fold','fade','boxRandom','boxRain','boxRainReverse','boxRainGrow','boxRainGrowReverse');vars.randAnim=anims[Math.floor(Math.random()*(anims.length+1))];if(vars.randAnim==undefined)vars.randAnim='fade';} +if(settings.effect.indexOf(',')!=-1){var anims=settings.effect.split(',');vars.randAnim=anims[Math.floor(Math.random()*(anims.length))];if(vars.randAnim==undefined)vars.randAnim='fade';} +vars.running=true;if(settings.effect=='sliceDown'||settings.effect=='sliceDownRight'||vars.randAnim=='sliceDownRight'||settings.effect=='sliceDownLeft'||vars.randAnim=='sliceDownLeft'){createSlices(slider,settings,vars);var timeBuff=0;var i=0;var slices=$('.nivo-slice',slider);if(settings.effect=='sliceDownLeft'||vars.randAnim=='sliceDownLeft')slices=$('.nivo-slice',slider)._reverse();slices.each(function(){var slice=$(this);slice.css({'top':'0px'});if(i==settings.slices-1){setTimeout(function(){slice.animate({height:'100%',opacity:'1.0'},settings.animSpeed,'',function(){slider.trigger('nivo:animFinished');});},(100+timeBuff));}else{setTimeout(function(){slice.animate({height:'100%',opacity:'1.0'},settings.animSpeed);},(100+timeBuff));} +timeBuff+=50;i++;});} +else if(settings.effect=='sliceUp'||settings.effect=='sliceUpRight'||vars.randAnim=='sliceUpRight'||settings.effect=='sliceUpLeft'||vars.randAnim=='sliceUpLeft'){createSlices(slider,settings,vars);var timeBuff=0;var i=0;var slices=$('.nivo-slice',slider);if(settings.effect=='sliceUpLeft'||vars.randAnim=='sliceUpLeft')slices=$('.nivo-slice',slider)._reverse();slices.each(function(){var slice=$(this);slice.css({'bottom':'0px'});if(i==settings.slices-1){setTimeout(function(){slice.animate({height:'100%',opacity:'1.0'},settings.animSpeed,'',function(){slider.trigger('nivo:animFinished');});},(100+timeBuff));}else{setTimeout(function(){slice.animate({height:'100%',opacity:'1.0'},settings.animSpeed);},(100+timeBuff));} +timeBuff+=50;i++;});} +else if(settings.effect=='sliceUpDown'||settings.effect=='sliceUpDownRight'||vars.randAnim=='sliceUpDown'||settings.effect=='sliceUpDownLeft'||vars.randAnim=='sliceUpDownLeft'){createSlices(slider,settings,vars);var timeBuff=0;var i=0;var v=0;var slices=$('.nivo-slice',slider);if(settings.effect=='sliceUpDownLeft'||vars.randAnim=='sliceUpDownLeft')slices=$('.nivo-slice',slider)._reverse();slices.each(function(){var slice=$(this);if(i==0){slice.css('top','0px');i++;}else{slice.css('bottom','0px');i=0;} +if(v==settings.slices-1){setTimeout(function(){slice.animate({height:'100%',opacity:'1.0'},settings.animSpeed,'',function(){slider.trigger('nivo:animFinished');});},(100+timeBuff));}else{setTimeout(function(){slice.animate({height:'100%',opacity:'1.0'},settings.animSpeed);},(100+timeBuff));} +timeBuff+=50;v++;});} +else if(settings.effect=='fold'||vars.randAnim=='fold'){createSlices(slider,settings,vars);var timeBuff=0;var i=0;$('.nivo-slice',slider).each(function(){var slice=$(this);var origWidth=slice.width();slice.css({top:'0px',height:'100%',width:'0px'});if(i==settings.slices-1){setTimeout(function(){slice.animate({width:origWidth,opacity:'1.0'},settings.animSpeed,'',function(){slider.trigger('nivo:animFinished');});},(100+timeBuff));}else{setTimeout(function(){slice.animate({width:origWidth,opacity:'1.0'},settings.animSpeed);},(100+timeBuff));} +timeBuff+=50;i++;});} +else if(settings.effect=='fade'||vars.randAnim=='fade'){createSlices(slider,settings,vars);var firstSlice=$('.nivo-slice:first',slider);firstSlice.css({'height':'100%','width':slider.width()+'px'});firstSlice.animate({opacity:'1.0'},(settings.animSpeed*2),'',function(){slider.trigger('nivo:animFinished');});} +else if(settings.effect=='slideInRight'||vars.randAnim=='slideInRight'){createSlices(slider,settings,vars);var firstSlice=$('.nivo-slice:first',slider);firstSlice.css({'height':'100%','width':'0px','opacity':'1'});firstSlice.animate({width:slider.width()+'px'},(settings.animSpeed*2),'',function(){slider.trigger('nivo:animFinished');});} +else if(settings.effect=='slideInLeft'||vars.randAnim=='slideInLeft'){createSlices(slider,settings,vars);var firstSlice=$('.nivo-slice:first',slider);firstSlice.css({'height':'100%','width':'0px','opacity':'1','left':'','right':'0px'});firstSlice.animate({width:slider.width()+'px'},(settings.animSpeed*2),'',function(){firstSlice.css({'left':'0px','right':''});slider.trigger('nivo:animFinished');});} +else if(settings.effect=='boxRandom'||vars.randAnim=='boxRandom'){createBoxes(slider,settings,vars);var totalBoxes=settings.boxCols*settings.boxRows;var i=0;var timeBuff=0;var boxes=shuffle($('.nivo-box',slider));boxes.each(function(){var box=$(this);if(i==totalBoxes-1){setTimeout(function(){box.animate({opacity:'1'},settings.animSpeed,'',function(){slider.trigger('nivo:animFinished');});},(100+timeBuff));}else{setTimeout(function(){box.animate({opacity:'1'},settings.animSpeed);},(100+timeBuff));} +timeBuff+=20;i++;});} +else if(settings.effect=='boxRain'||vars.randAnim=='boxRain'||settings.effect=='boxRainReverse'||vars.randAnim=='boxRainReverse'||settings.effect=='boxRainGrow'||vars.randAnim=='boxRainGrow'||settings.effect=='boxRainGrowReverse'||vars.randAnim=='boxRainGrowReverse'){createBoxes(slider,settings,vars);var totalBoxes=settings.boxCols*settings.boxRows;var i=0;var timeBuff=0;var rowIndex=0;var colIndex=0;var box2Darr=new Array();box2Darr[rowIndex]=new Array();var boxes=$('.nivo-box',slider);if(settings.effect=='boxRainReverse'||vars.randAnim=='boxRainReverse'||settings.effect=='boxRainGrowReverse'||vars.randAnim=='boxRainGrowReverse'){boxes=$('.nivo-box',slider)._reverse();} +boxes.each(function(){box2Darr[rowIndex][colIndex]=$(this);colIndex++;if(colIndex==settings.boxCols){rowIndex++;colIndex=0;box2Darr[rowIndex]=new Array();}});for(var cols=0;cols<(settings.boxCols*2);cols++){var prevCol=cols;for(var rows=0;rows=0&&prevCol').parent(); + orbit.add(orbitWidth).width('1px').height('1px'); + + //Collect all slides and set slider size of largest image + var slides = orbit.children('img, a, div'); + slides.each(function() { + var _slide = $(this); + numberSlides++; + }); + + //Animation locking functions + function unlock() { + locked = false; + } + function lock() { + locked = true; + } + + //If there is only a single slide remove nav, timer and bullets + if(slides.length == 1) { + options.directionalNav = false; + options.timer = false; + options.bullets = false; + } + + //Set initial front photo z-index and fades it in + slides.eq(activeSlide) + .css({"z-index" : 3}) + .fadeIn(function() { + //brings in all other slides IF css declares a display: none + slides.css({"display":"block"}) + }); + +// ============== +// ! TIMER +// ============== + + //Timer Execution + function startClock() { + if(!options.timer || options.timer == 'false') { + return false; + //if timer is hidden, don't need to do crazy calculations + } else if(timer.is(':hidden')) { + clock = setInterval(function(e){ + shift("next"); + }, options.advanceSpeed); + //if timer is visible and working, let's do some math + } else { + timerRunning = true; + pause.removeClass('active') + clock = setInterval(function(e){ + var degreeCSS = "rotate("+degrees+"deg)" + degrees += 2 + rotator.css({ + "-webkit-transform": degreeCSS, + "-moz-transform": degreeCSS, + "-o-transform": degreeCSS + }); + if(degrees > 180) { + rotator.addClass('move'); + mask.addClass('move'); + } + if(degrees > 360) { + rotator.removeClass('move'); + mask.removeClass('move'); + degrees = 0; + shift("next"); + } + }, options.advanceSpeed/180); + } + } + function stopClock() { + if(!options.timer || options.timer == 'false') { return false; } else { + timerRunning = false; + clearInterval(clock); + pause.addClass('active'); + } + } + + //Timer Setup + if(options.timer) { + var timerHTML = '
' + orbitWrapper.append(timerHTML); + var timer = $('div.timer'), + timerRunning; + if(timer.length != 0) { + var rotator = $('div.timer span.rotator'), + mask = $('div.timer span.mask'), + pause = $('div.timer span.pause'), + degrees = 0, + clock; + startClock(); + timer.click(function() { + if(!timerRunning) { + startClock(); + } else { + stopClock(); + } + }); + if(options.startClockOnMouseOut){ + var outTimer; + orbitWrapper.mouseleave(function() { + outTimer = setTimeout(function() { + if(!timerRunning){ + startClock(); + } + }, options.startClockOnMouseOutAfter) + }) + orbitWrapper.mouseenter(function() { + clearTimeout(outTimer); + }) + } + } + } + + //Pause Timer on hover + if(options.pauseOnHover) { + orbitWrapper.mouseenter(function() { + stopClock(); + }); + } + +// ============== +// ! CAPTIONS +// ============== + + //Caption Setup + if(options.captions) { + var captionHTML = '
'; + orbitWrapper.append(captionHTML); + var caption = orbitWrapper.children('.orbit-caption'); + setCaption(); + } + + //Caption Execution + function setCaption() { + if(!options.captions || options.captions =="false") { + return false; + } else { + var _captionLocation = slides.eq(activeSlide).data('caption'); //get ID from rel tag on image + _captionHTML = $(_captionLocation).html(); //get HTML from the matching HTML entity + //Set HTML for the caption if it exists + if(_captionHTML) { + caption + .attr('id',_captionLocation) // Add ID caption + .html(_captionHTML); // Change HTML in Caption + //Animations for Caption entrances + if(options.captionAnimation == 'none') { + caption.show(); + } + if(options.captionAnimation == 'fade') { + caption.fadeIn(options.captionAnimationSpeed); + } + if(options.captionAnimation == 'slideOpen') { + caption.slideDown(options.captionAnimationSpeed); + } + } else { + //Animations for Caption exits + if(options.captionAnimation == 'none') { + caption.hide(); + } + if(options.captionAnimation == 'fade') { + caption.fadeOut(options.captionAnimationSpeed); + } + if(options.captionAnimation == 'slideOpen') { + caption.slideUp(options.captionAnimationSpeed); + } + } + } + } + +// ================== +// ! DIRECTIONAL NAV +// ================== + + //DirectionalNav { rightButton --> shift("next"), leftButton --> shift("prev"); + if(options.directionalNav) { + if(options.directionalNav == "false") { return false; } + var directionalNavHTML = '
RightLeft
'; + orbitWrapper.append(directionalNavHTML); + var leftBtn = orbitWrapper.children('div.slider-nav').children('span.left'), + rightBtn = orbitWrapper.children('div.slider-nav').children('span.right'); + leftBtn.click(function() { + stopClock(); + shift("prev"); + }); + rightBtn.click(function() { + stopClock(); + shift("next") + }); + } + +// ================== +// ! BULLET NAV +// ================== + + //Bullet Nav Setup + if(options.bullets) { + var bulletHTML = '
    '; + orbitWrapper.append(bulletHTML); + var bullets = $('ul.orbit-bullets'); + for(i=0; i'+(i+1)+''); + if(options.bulletThumbs) { + var thumbName = slides.eq(i).data('thumb'); + if(thumbName) { + var liMarkup = $('
  • '+i+'
    • ') + liMarkup.css({"background" : "url("+options.bulletThumbLocation+thumbName+") no-repeat"}); + } + } + $('ul.orbit-bullets').append(liMarkup); + liMarkup.data('index',i); + liMarkup.click(function() { + stopClock(); + shift($(this).data('index')); + }); + } + setActiveBullet(); + } + + //Bullet Nav Execution + function setActiveBullet() { + if(!options.bullets) { return false; } else { + bullets.children('li').removeClass('active').eq(activeSlide).addClass('active'); + } + } + +// ==================== +// ! SHIFT ANIMATIONS +// ==================== + + //Animating the shift! + function shift(direction) { + //remember previous activeSlide + var prevActiveSlide = activeSlide, + slideDirection = direction; + //exit function if bullet clicked is same as the current image + if(prevActiveSlide == slideDirection) { return false; } + //reset Z & Unlock + function resetAndUnlock() { + slides + .eq(prevActiveSlide) + .css({"z-index" : 1}); + unlock(); + options.afterSlideChange.call(this); + } + if(slides.length == "1") { return false; } + if(!locked) { + lock(); + //deduce the proper activeImage + if(direction == "next") { + activeSlide++ + if(activeSlide == numberSlides) { + activeSlide = 0; + } + } else if(direction == "prev") { + activeSlide-- + if(activeSlide < 0) { + activeSlide = numberSlides-1; + } + } else { + activeSlide = direction; + if (prevActiveSlide < activeSlide) { + slideDirection = "next"; + } else if (prevActiveSlide > activeSlide) { + slideDirection = "prev" + } + } + //set to correct bullet + setActiveBullet(); + + //set previous slide z-index to one below what new activeSlide will be + slides + .eq(prevActiveSlide) + .css({"z-index" : 2}); + + //fade + if(options.animation == "fade") { + slides + .eq(activeSlide) + .css({"opacity" : 0, "z-index" : 3}) + .animate({"opacity" : 1}, options.animationSpeed, resetAndUnlock); + } + //horizontal-slide + if(options.animation == "horizontal-slide") { + if(slideDirection == "next") { + slides + .eq(activeSlide) + .css({"left": orbitWidth, "z-index" : 3}) + .animate({"left" : 0}, options.animationSpeed, resetAndUnlock); + } + if(slideDirection == "prev") { + slides + .eq(activeSlide) + .css({"left": -orbitWidth, "z-index" : 3}) + .animate({"left" : 0}, options.animationSpeed, resetAndUnlock); + } + } + //vertical-slide + if(options.animation == "vertical-slide") { + if(slideDirection == "prev") { + slides + .eq(activeSlide) + .css({"top": orbitHeight, "z-index" : 3}) + .animate({"top" : 0}, options.animationSpeed, resetAndUnlock); + } + if(slideDirection == "next") { + slides + .eq(activeSlide) + .css({"top": -orbitHeight, "z-index" : 3}) + .animate({"top" : 0}, options.animationSpeed, resetAndUnlock); + } + } + //push-over + if(options.animation == "horizontal-push") { + if(slideDirection == "next") { + slides + .eq(activeSlide) + .css({"left": orbitWidth, "z-index" : 3}) + .animate({"left" : 0}, options.animationSpeed, resetAndUnlock); + slides + .eq(prevActiveSlide) + .animate({"left" : -orbitWidth}, options.animationSpeed); + } + if(slideDirection == "prev") { + slides + .eq(activeSlide) + .css({"left": -orbitWidth, "z-index" : 3}) + .animate({"left" : 0}, options.animationSpeed, resetAndUnlock); + slides + .eq(prevActiveSlide) + .animate({"left" : orbitWidth}, options.animationSpeed); + } + } + setCaption(); + } //lock + }//orbit function + });//each call + }//orbit plugin call +})(jQuery); + \ No newline at end of file diff --git a/test/test-one/jquery.orbit-1.2.3.min.js b/test/test-one/jquery.orbit-1.2.3.min.js new file mode 100644 index 0000000..13acb8d --- /dev/null +++ b/test/test-one/jquery.orbit-1.2.3.min.js @@ -0,0 +1,17 @@ +/* + * jQuery Orbit Plugin 1.2.3 + * www.ZURB.com/playground + * Copyright 2010, ZURB + * Free to use under the MIT license. + * http://www.opensource.org/licenses/mit-license.php +*/ + +(function(d){d.fn.orbit=function(a){a=d.extend({animation:"horizontal-push",animationSpeed:600,timer:!0,advanceSpeed:4E3,pauseOnHover:!1,startClockOnMouseOut:!1,startClockOnMouseOutAfter:1E3,directionalNav:!0,captions:!0,captionAnimation:"fade",captionAnimationSpeed:600,bullets:!1,bulletThumbs:!1,bulletThumbLocation:"",afterSlideChange:function(){}},a);return this.each(function(){function q(){if(!a.timer||a.timer=="false")return!1;else r.is(":hidden")?s=setInterval(function(){l("next")},a.advanceSpeed): +(o=!0,x.removeClass("active"),s=setInterval(function(){var a="rotate("+m+"deg)";m+=2;t.css({"-webkit-transform":a,"-moz-transform":a,"-o-transform":a});m>180&&(t.addClass("move"),z.addClass("move"));m>360&&(t.removeClass("move"),z.removeClass("move"),m=0,l("next"))},a.advanceSpeed/180))}function n(){if(!a.timer||a.timer=="false")return!1;else o=!1,clearInterval(s),x.addClass("active")}function A(){if(!a.captions||a.captions=="false")return!1;else{var y=e.eq(b).data("caption");(_captionHTML=d(y).html())? +(j.attr("id",y).html(_captionHTML),a.captionAnimation=="none"&&j.show(),a.captionAnimation=="fade"&&j.fadeIn(a.captionAnimationSpeed),a.captionAnimation=="slideOpen"&&j.slideDown(a.captionAnimationSpeed)):(a.captionAnimation=="none"&&j.hide(),a.captionAnimation=="fade"&&j.fadeOut(a.captionAnimationSpeed),a.captionAnimation=="slideOpen"&&j.slideUp(a.captionAnimationSpeed))}}function B(){if(a.bullets)D.children("li").removeClass("active").eq(b).addClass("active");else return!1}function l(d){function c(){e.eq(f).css({"z-index":1}); +u=!1;a.afterSlideChange.call(this)}var f=b,g=d;if(f==g)return!1;if(e.length=="1")return!1;u||(u=!0,d=="next"?(b++,b==p&&(b=0)):d=="prev"?(b--,b<0&&(b=p-1)):(b=d,fb&&(g="prev")),B(),e.eq(f).css({"z-index":2}),a.animation=="fade"&&e.eq(b).css({opacity:0,"z-index":3}).animate({opacity:1},a.animationSpeed,c),a.animation=="horizontal-slide"&&(g=="next"&&e.eq(b).css({left:h,"z-index":3}).animate({left:0},a.animationSpeed,c),g=="prev"&&e.eq(b).css({left:-h,"z-index":3}).animate({left:0},a.animationSpeed, +c)),a.animation=="vertical-slide"&&(g=="prev"&&e.eq(b).css({top:v,"z-index":3}).animate({top:0},a.animationSpeed,c),g=="next"&&e.eq(b).css({top:-v,"z-index":3}).animate({top:0},a.animationSpeed,c)),a.animation=="horizontal-push"&&(g=="next"&&(e.eq(b).css({left:h,"z-index":3}).animate({left:0},a.animationSpeed,c),e.eq(f).animate({left:-h},a.animationSpeed)),g=="prev"&&(e.eq(b).css({left:-h,"z-index":3}).animate({left:0},a.animationSpeed,c),e.eq(f).animate({left:h},a.animationSpeed))),A())}var b=0, +p=0,h,v,u,f=d(this).addClass("orbit"),c=f.wrap('
    ').parent();f.add(h).width("1px").height("1px");var e=f.children("img, a, div");e.each(function(){var a=d(this),b=a.width(),a=a.height();b>f.width()&&(f.add(c).width(b),h=f.width());a>f.height()&&(f.add(c).height(a),v=f.height());p++});if(e.length==1)a.directionalNav=!1,a.timer=!1,a.bullets=!1;e.eq(b).css({"z-index":3}).fadeIn(function(){e.css({display:"block"})});if(a.timer){c.append('
    '); +var r=d("div.timer"),o;if(r.length!=0){var t=d("div.timer span.rotator"),z=d("div.timer span.mask"),x=d("div.timer span.pause"),m=0,s;q();r.click(function(){o?n():q()});if(a.startClockOnMouseOut){var C;c.mouseleave(function(){C=setTimeout(function(){o||q()},a.startClockOnMouseOutAfter)});c.mouseenter(function(){clearTimeout(C)})}}}a.pauseOnHover&&c.mouseenter(function(){n()});if(a.captions){c.append('
    ');var j=c.children(".orbit-caption");A()}if(a.directionalNav){if(a.directionalNav== +"false")return!1;c.append('
    RightLeft
    ');var k=c.children("div.slider-nav").children("span.left"),w=c.children("div.slider-nav").children("span.right");k.click(function(){n();l("prev")});w.click(function(){n();l("next")})}if(a.bullets){c.append('
      ');var D=d("ul.orbit-bullets");for(i=0;i"+(i+1)+"");if(a.bulletThumbs&&(w=e.eq(i).data("thumb")))k=d('
    • '+ +i+"
      • "),k.css({background:"url("+a.bulletThumbLocation+w+") no-repeat"});d("ul.orbit-bullets").append(k);k.data("index",i);k.click(function(){n();l(d(this).data("index"))})}B()}})}})(jQuery); \ No newline at end of file diff --git a/test/test-one/main.css b/test/test-one/main.css new file mode 100644 index 0000000..786dbc1 --- /dev/null +++ b/test/test-one/main.css @@ -0,0 +1,66 @@ +/* +* Skeleton V1.0 +* Created by Dave Gamache +* www.skeleton.gs +* 4/30/2011 +*/ + +/* Table of Content +================================================== + #Site Styles + #Page Styles + #Media Queries */ + +/* Site Styles +================================================== */ + nav { + margin-top: 20px; + overflow: hidden; } + logo h4 { + float: left; + margin-bottom: 10px; } + nav ul { + margin-top: 8px; + float: right; + margin-bottom: 10px; } + nav ul li { + float: left; + margin-left: 10px; } + nav ul li a { + text-decoration: none; } + .nivo-directionNav { + display: block !important;} + #slider { + max-width: 100% !important; + height: auto; } + + +/* Page Styles +================================================== */ + +/* Media Queries +================================================== */ + + /* iPad Portrait/Browser */ + @media only screen and (min-width: 768px) and (max-width: 991px) {} + + /* Mobile/Browser */ + @media only screen and (max-width: 767px) { + nav ul { float: left; } + nav ul li:first-child{ margin-left: 0; } + } + + /* Mobile Landscape/Browser */ + @media only screen and (min-width: 480px) and (max-width: 767px) {} + + /* Anything smaller than standard 960 */ + @media only screen and (max-width: 959px) {} + + /* iPad Portrait Only */ + @media only screen and (min-width: 768px) and (max-width: 991px) and (max-device-width: 1000px) {} + + /* Mobile Only */ + @media only screen and (max-width: 767px) and (max-device-width: 1000px) {} + + /* Mobile Landscape Only */ + @media only screen and (min-width: 480px) and (max-width: 767px) and (max-device-width: 1000px) {} \ No newline at end of file diff --git a/test/test-one/nivo-slider.css b/test/test-one/nivo-slider.css new file mode 100755 index 0000000..f1a03a1 --- /dev/null +++ b/test/test-one/nivo-slider.css @@ -0,0 +1,89 @@ +/* + * jQuery Nivo Slider v2.5.1 + * http://nivo.dev7studios.com + * + * Copyright 2011, Gilbert Pellegrom + * Free to use and abuse under the MIT license. + * http://www.opensource.org/licenses/mit-license.php + * + * March 2010 + */ + + +/* The Nivo Slider styles */ +.nivoSlider { + position:relative; +} +.nivoSlider img { + position:absolute; + top:0px; + left:0px; +} +/* If an image is wrapped in a link */ +.nivoSlider a.nivo-imageLink { + position:absolute; + top:0px; + left:0px; + width:100%; + height:100%; + border:0; + padding:0; + margin:0; + z-index:6; + display:none; +} +/* The slices and boxes in the Slider */ +.nivo-slice { + display:block; + position:absolute; + z-index:5; + height:100%; +} +.nivo-box { + display:block; + position:absolute; + z-index:5; +} +/* Caption styles */ +.nivo-caption { + position:absolute; + left:0px; + bottom:0px; + background:#000; + color:#fff; + opacity:0.8; /* Overridden by captionOpacity setting */ + width:100%; + z-index:8; +} +.nivo-caption p { + padding:5px; + margin:0; +} +.nivo-caption a { + display:inline !important; +} +.nivo-html-caption { + display:none; +} +/* Direction nav styles (e.g. Next & Prev) */ +.nivo-directionNav a { + position:absolute; + top:45%; + z-index:9; + cursor:pointer; +} +.nivo-prevNav { + left:0px; +} +.nivo-nextNav { + right:0px; +} +/* Control nav styles (e.g. 1,2,3...) */ +.nivo-controlNav a { + position:relative; + z-index:9; + cursor:pointer; +} +.nivo-controlNav a.active { + font-weight:bold; +} \ No newline at end of file diff --git a/test/test-one/orbit-1.2.3.css b/test/test-one/orbit-1.2.3.css new file mode 100644 index 0000000..66ee74c --- /dev/null +++ b/test/test-one/orbit-1.2.3.css @@ -0,0 +1,199 @@ +/* CSS for jQuery Orbit Plugin 1.2.3 + * www.ZURB.com/playground + * Copyright 2010, ZURB + * Free to use under the MIT license. + * http://www.opensource.org/licenses/mit-license.php + + + +/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY + ================================================== */ +/* +#slider { + width: 940px; + height: 450px; + background: #000 url('orbit/loading.gif') no-repeat center center; + overflow: hidden; } +#slider>img, +#slider>div, +#slider>a { display: none; } +*/ + + + + +/* CONTAINER + ================================================== */ + +div.orbit-wrapper { + position: relative; } + +div.orbit { + position: relative; + overflow: hidden } + +div.orbit>img { + position: absolute; + top: 0; + left: 0; + display: none; } + +div.orbit>a { + border: none; + position: absolute; + top: 0; + left: 0; + line-height: 0; + display: none; } + +.orbit>div { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; } + +/* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */ + + +/* TIMER + ================================================== */ + +div.timer { + width: 40px; + height: 40px; + overflow: hidden; + position: absolute; + top: 10px; + right: 10px; + opacity: .6; + cursor: pointer; + z-index: 1001; } + +span.rotator { + display: block; + width: 40px; + height: 40px; + position: absolute; + top: 0; + left: -20px; + background: url(orbit/rotator-black.png) no-repeat; + z-index: 3; } + +span.mask { + display: block; + width: 20px; + height: 40px; + position: absolute; + top: 0; + right: 0; + z-index: 2; + overflow: hidden; } + +span.rotator.move { + left: 0 } + +span.mask.move { + width: 40px; + left: 0; + background: url(orbit/timer-black.png) repeat 0 0; } + +span.pause { + display: block; + width: 40px; + height: 40px; + position: absolute; + top: 0; + left: 0; + background: url(orbit/pause-black.png) no-repeat; + z-index: 4; + opacity: 0; } + +span.pause.active { + background: url(orbit/pause-black.png) no-repeat 0 -40px } + +div.timer:hover span.pause, +span.pause.active { + opacity: 1 } + + +/* CAPTIONS + ================================================== */ + +.orbit-caption { + display: none; + font-family: "HelveticaNeue", "Helvetica-Neue", Helvetica, Arial, sans-serif; } + +.orbit-wrapper .orbit-caption { + background: #000; + background: rgba(0,0,0,.6); + z-index: 1000; + color: #fff; + text-align: center; + padding: 7px 0; + font-size: 13px; + position: absolute; + right: 0; + bottom: 0; + width: 100%; } + + +/* DIRECTIONAL NAV + ================================================== */ + +div.slider-nav { + display: block } + +div.slider-nav span { + width: 78px; + height: 100px; + text-indent: -9999px; + position: absolute; + z-index: 1000; + top: 50%; + margin-top: -50px; + cursor: pointer; } + +div.slider-nav span.right { + background: url(orbit/right-arrow.png); + right: 0; } + +div.slider-nav span.left { + background: url(orbit/left-arrow.png); + left: 0; } + +/* BULLET NAV + ================================================== */ + +.orbit-bullets { + position: absolute; + z-index: 1000; + list-style: none; + bottom: -40px; + left: 50%; + margin-left: -50px; + padding: 0; } + +.orbit-bullets li { + float: left; + margin-left: 5px; + cursor: pointer; + color: #999; + text-indent: -9999px; + background: url(orbit/bullets.jpg) no-repeat 4px 0; + width: 13px; + height: 12px; + overflow: hidden; } + +.orbit-bullets li.active { + color: #222; + background-position: -8px 0; } + +.orbit-bullets li.has-thumb { + background: none; + width: 100px; + height: 75px; } + +.orbit-bullets li.active.has-thumb { + background-position: 0 0; + border-top: 2px solid #000; } \ No newline at end of file diff --git a/test/test-one/orbit/bullets.jpg b/test/test-one/orbit/bullets.jpg new file mode 100644 index 0000000..f3c734f Binary files /dev/null and b/test/test-one/orbit/bullets.jpg differ diff --git a/test/test-one/orbit/left-arrow.png b/test/test-one/orbit/left-arrow.png new file mode 100644 index 0000000..e832021 Binary files /dev/null and b/test/test-one/orbit/left-arrow.png differ diff --git a/test/test-one/orbit/loading.gif b/test/test-one/orbit/loading.gif new file mode 100644 index 0000000..969f505 Binary files /dev/null and b/test/test-one/orbit/loading.gif differ diff --git a/test/test-one/orbit/mask-black.png b/test/test-one/orbit/mask-black.png new file mode 100644 index 0000000..e4e77b5 Binary files /dev/null and b/test/test-one/orbit/mask-black.png differ diff --git a/test/test-one/orbit/pause-black.png b/test/test-one/orbit/pause-black.png new file mode 100644 index 0000000..a14adc7 Binary files /dev/null and b/test/test-one/orbit/pause-black.png differ diff --git a/test/test-one/orbit/right-arrow.png b/test/test-one/orbit/right-arrow.png new file mode 100644 index 0000000..e4e0345 Binary files /dev/null and b/test/test-one/orbit/right-arrow.png differ diff --git a/test/test-one/orbit/rotator-black.png b/test/test-one/orbit/rotator-black.png new file mode 100644 index 0000000..a0d24a7 Binary files /dev/null and b/test/test-one/orbit/rotator-black.png differ diff --git a/test/test-one/orbit/timer-black.png b/test/test-one/orbit/timer-black.png new file mode 100644 index 0000000..e4e77b5 Binary files /dev/null and b/test/test-one/orbit/timer-black.png differ diff --git a/test/test-one/slider-2.jpg b/test/test-one/slider-2.jpg new file mode 100644 index 0000000..8161bb8 Binary files /dev/null and b/test/test-one/slider-2.jpg differ diff --git a/test/test-one/slider.jpg b/test/test-one/slider.jpg new file mode 100644 index 0000000..61e4ae8 Binary files /dev/null and b/test/test-one/slider.jpg differ