InContent

InContent, a Image content with description created with CSS3 and SASS/LESS.

DOWNLOAD
Pic

Bottom to Top

Hi, this is a simple example =D
Pic

Top to Bottom

Hi, this is a simple example =D
Pic

Left to Right

Hi, this is a simple example =D
Pic

Right to Left

Hi, this is a simple example =D
Pic

Rotate In

Hi, this is a simple example =D
Pic

Rotate Out

Hi, this is a simple example =D
Pic

Open Up

Hi, this is a simple example =D
Pic

Open Down

Hi, this is a simple example =D
Pic

Open Left

Hi, this is a simple example =D
Pic

Open Right

Hi, this is a simple example =D
Pic

Come Left

Hi, this is a simple example =D
Pic

Come Right

Hi, this is a simple example =D

How To Use

Inside the in your HTML, put the following code for call the CSS:

SASS Version 
<link rel="stylesheet" href="css/sass-compiled.css" type="text/css" />
LESS Version 
<link rel="stylesheet" href="css/less-compiled.css" type="text/css" />

Put the code below in your HTML document:

HTML Document 
<div class="pic">
	<img src="img/01.jpg" class="pic-image" alt="Pic"/>
	<span class="pic-caption bottom-to-top">
		<h1 class="pic-title">Pic Title</h1>
		<p>Some description or text.</p>
	</span>
</div>

The is the class with the effects of your choice, see example:

Pic

Pic Title

Some description or text.

List of Effects

Here is the list of classes and effect that you can use:

Class Description
.pic-title Title of the image content
.bottom-to-top Effect bottom to top
.top-to-bottom Effect top to bottom
.left-to-right Effect left to right
.right-to-left Effect right to left
.rotate-in Effect rotate in
.rotate-out Effect rotate out
.open-up Effect open up
.open-down Effect open down
.open-left Effect open left
.open-right Effect open right
.come-left Effect come to left
.come-right Effect come to right

License

InContent is released under MIT License.

DOWNLOAD .ZIP VIEW IN GITHUB SAY HELLO! QR CODE
close x

Test in your Mobile Device

Use some app for read the QR code and test in your mobile. If you dont have, what do you waiting?! =D

Take a look, its Free - QR Reader: iPhone, Android and Windows Phone.

InContent - QRcode