iOS Cheat sheet ;-)

 

Recently I’ve been working on a new brand and digital elements for a upcoming video start up (more to follow!)

Upon researching different iOS specs I found this real useful cheat sheet for pretty much everything you need to know!

 

Thought I would share………    www.ivomynttinen.com/blog/the-ios-7-design-cheat-sheet

 

ios-cheatsheet

Standard

Image Slider Research

Looking at  a few image gallery solutions for a new project I have come across quite a few neat lil solutions.

I have posted this one before but its def worth a second mention:

http://www.idangero.us/sliders/swiper/

Lightweight Jquery one:

http://unslider.com/

 

PURE css solution: (think imma use this)

http://codepen.io/pixelgrid/pen/hjBrE

 

Try it for yourself!

 

<div class="container">
  <img class='photo'  src="http://payload242.cargocollective.com/1/14/471437/7142426/coca-web1.jpg" alt="" />
  <img class='photo'  src="http://payload242.cargocollective.com/1/14/471437/7142426/coca-web2.jpg" alt="" />
  <img class='photo'  src="http://payload242.cargocollective.com/1/14/471437/7142426/coca-web3.jpg" alt="" />
  <img class='photo'  src="http://payload242.cargocollective.com/1/14/471437/7142846/jamindustries-web1.jpg" alt="" />

</div>

.container{
  margin:20px auto;
  width:800px;
  height:500px;
  overflow:hidden;
  position:relative;

}
.photo{
  position:absolute;
  animation:round 16s infinite;
  opacity:0;

}
@keyframes round{
  25%{opacity:1;}
  40%{opacity:0;}
} 

img:nth-child(4){animation-delay:0s;}
img:nth-child(3){animation-delay:4s;}
img:nth-child(2){animation-delay:8s;}
img:nth-child(1){animation-delay:12s;}

Standard