<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>
<b:skin><![CDATA[/*
-----------------------------------------------
Blogger :Hadie Danker
Name: Toko Online
Date: 14 April 2010
URL : http://www.dankerizer.com/
Updated by: Blog and SEO Tips
----------------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;
}
body { line-height: 1;
}
ol, ul { list-style: none;
}
blockquote, q { quotes: none;
}
/ remember to define focus styles! /
:focus { outline: 0;
}
/ remember to highlight inserts somehow! /
ins { text-decoration: none;
}
del { text-decoration: line-through;
}
/ tables still need ‘cellspacing=”0”’ in the markup /
table { border-collapse: collapse; border-spacing: 0;
}
/**********************************
DEMO STYLES
**********************************/
body{
background:#000 ;
font:16px "HelveticaNeue-Light", "Helvetica Neue", "HelveticaNeue", Helvetica, Arial, sans-serif;
color:#cacaca;
}
#demoContainer{
width:855px;
height:832px;
margin:50px auto 0 auto;
padding:38px 0 0 49px;
background:url(http://demo.simplecartjs.com/images/BGDemoContainer.png) no-repeat;
}
.simpleCart_shelfItem{
float:left;
margin:47px 10px 0 0;
width:250px;
height:141px;
line-height:100%;
position:relative;
}
.item_image{
float:left;
margin-right:15px;
}
.item_name{
text-transform:uppercase;
font:bold 12px "Helvetica", Arial, sans-serif;
color:#fff;
margin-top:15px;
}
.item_Description{
font-size:11px;
padding:5px 0;
}
.item_price{
font:bold 12px "Helvetica", Arial, sans-serif;
color:#fff;
float:left;
margin:6px 3px 0 0;
position:absolute;
bottom:13px;
left:118px;
}
.item_thumb{
display:none;
}
.item_add{
display:block;
width:85px;
height:25px;
text-indent:-9999px;
overflow:hidden;
background:url(http://demo.simplecartjs.com/images/demoSprite.png) 0 -21px;
position:absolute;
bottom:8px;
right:3px;
}
.item_add:hover{
background-position:-85px -21px;
}
.item_add:active{
background-position:-170px -21px;
}
.simpleCart_items{
clear:both;
float:left;
margin: 18px 0px 0px 11px;
height:170px;
position:relative;
}
.cartHeaders{
display:none;
}
.itemContainer{
float:left;
width:110px;
text-align:center;
margin-right:25px;
position:relative;
bottom:0;
}
.itemname{
font:bold 11px "Helvetica", Arial, sans-serif;
color:#fff;
text-transform:uppercase;
}
.itemthumb{
float:none;
margin:0;
padding-top:5px;
}
.itemthumb img{
max-width:77px;
}
.itemQuantity{
float:left;
clear:both;
margin-top:5px;
display:inline;
margin-left:30px;
}
.itemQuantity input{
background:none;
border:none;
width:21px;
height:17px;
background:url(http://demo.simplecartjs.com/images/demoSprite.png);
text-align:center;
color:#fff;
font:bold 11px Arial, sans-serif;
padding:0 9px;
margin:0 5px 0 0;
vertical-align:top;
padding-top:3px;
}
.itemQuantity input:focus{
outline:none;
}
.itemincrement a{
display:block;
background:url(http://demo.simplecartjs.com/images/demoSprite.png) -278px -29px;
width:7px;
height:5px;
text-indent:-9999px;
overflow:hidden;
margin:10px 0 0 0;
}
.itemdecrement a{
display:block;
background:url(http://demo.simplecartjs.com/images/demoSprite.png) -278px -35px;
width:7px;
height:5px;
text-indent:-9999px;
overflow:hidden;
margin:3px 0 0 0;
}
.itemTotal{
color:#fff;
font:bold 11px Arial, sans-serif;
margin:8px 0 0 0;
padding:0;
clear:both;
}
#cartTotal{
clear:both;
text-align:right;
font:11px Arial, sans-serif;
text-shadow:none;
margin-top:23px;
float:left;
width:100%;
margin-left:-65px;
padding: 47px 72px 0px 0px;
}
#viewFullDemoLink{
clear:both;
font:10px Arial, sans-serif;
display:block;
padding:5px 0 0 0;
margin-left:140px;
color:#fff;
text-decoration:none;
}
#viewFullDemoLink:hover{
text-decoration:underline;
}
.simpleCart_empty{
clear:both;
display:-moz-inline-box;
display:inline-block;
color:#fff;
font-size:11px;
text-decoration:none;
padding-left:665px;
margin-right:10px;
position:relative;
top:25px;
}
.simpleCart_checkout{
display:-moz-inline-box;
display:inline-block;
background:url(http://demo.simplecartjs.com/images/btnCheckout.png);
width:87px;
height:24px;
text-indent:-9999px;
overflow:hidden;
position:relative;
top:25px;
}
p{
padding:10px 0;
}
strong{
font-family:"Helvetica Neue", "HelveticaNeue", Helvetica, Arial, sans-serif;
font-weight:normal;
color:#fff;
}
h3{
margin:35px 3px 0 3px;
font:bold 20px "Helvetica", Arial, sans-serif;
color:#fff;
text-shadow: rgba(0, 0, 0, 0.796875) 0px -1px 1px;
}
]]></b:skin>
</head>
<body>
<script src='http://dinhquanghuy.110mb.com/simpleCart.js' type='text/javascript'/>
<script type='text/javascript'>
simpleCart.email = "hadie87@gmail.com";
simpleCart.checkoutTo = PayPal;
simpleCart.cartHeaders = [ "name", "thumb_image" , "Quantity_input" , "increment", "decrement", "Total" ];
</script>
<div id='demoContainer'>
<!--Create a div with the class simpleCart_shelfItem-->
<div class='simpleCart_shelfItem'>
<!--Notice the class names of each tag begin with item_ -->
<img alt='product 1' class='item_image' src='http://i604.photobucket.com/albums/tt130/metalner/simplexshop/attack-release.png' title='product 1'/>
<h5 class='item_name'>Sample DVD</h5>
<p class='item_Description'>
To create a shelf item, you create a div with a class of “simpleCart_shelfItem”.
</p>
<span class='item_price'>$14.99</span>
<a class='item_add' href='javascript:;' id='s1'>Add to Cart</a>
<span class='item_thumb'>http://i604.photobucket.com/albums/tt130/metalner/simplexshop/attack-release.png</span>
</div>
<!--Create a div with the class simpleCart_shelfItem-->
<div class='simpleCart_shelfItem'>
<!--Notice the class names of each tag begin with item_ -->
<img alt='product 2' class='item_image' src='http://i604.photobucket.com/albums/tt130/metalner/simplexshop/evil-empire.png' title='product 2'/>
<h5 class='item_name'>Sample DVD 2</h5>
<p class='item_Description'>
Any field you want for your item can be set by creating a tag with a class of “item_[field-name]”
</p>
<span class='item_price'>$22.99</span>
<a class='item_add' href='javascript:;' id='s2'>Add to Cart</a>
<span class='item_thumb'>http://i604.photobucket.com/albums/tt130/metalner/simplexshop/evil-empire.png</span>
</div>
<!--Create a div with the class simpleCart_shelfItem-->
<div class='simpleCart_shelfItem'>
<!--Notice the class names of each tag begin with item_ -->
<img alt='product 3' class='item_image' src='http://i604.photobucket.com/albums/tt130/metalner/simplexshop/the-incredibles.png' title='product 3'/>
<h5 class='item_name'>Sample Game</h5>
<p class='item_Description'>
To create the add to cart button create a tag with the class “item_quantity”.
</p>
<span class='item_price'>$59.99</span>
<a class='item_add' href='javascript:;' id='s3'>Add to Cart</a>
<span class='item_thumb'>http://i604.photobucket.com/albums/tt130/metalner/simplexshop/the-incredibles.png</span>
</div>
<!--Create a div with the class simpleCart_shelfItem-->
<div class='simpleCart_shelfItem'>
<!--Notice the class names of each tag begin with item_ -->
<img alt='product 4' class='item_image' src='http://i604.photobucket.com/albums/tt130/metalner/simplexshop/wolverine-3.png' title='product 4'/>
<h5 class='item_name'>Sample CD</h5>
<p class='item_Description'>
If can display info about the cart anywhere on your page.
</p>
<span class='item_price'>$8.99</span>
<a class='item_add' href='javascript:;' id='s4'>Add to Cart</a>
<span class='item_thumb'>http://i604.photobucket.com/albums/tt130/metalner/simplexshop/wolverine-3.png</span>
</div>
<!--Create a div with the class simpleCart_shelfItem-->
<div class='simpleCart_shelfItem'>
<!--Notice the class names of each tag begin with item_ -->
<img alt='product 5' class='item_image' src='http://i604.photobucket.com/albums/tt130/metalner/simplexshop/ghostbusters.png' title='product 5'/>
<h5 class='item_name'>Sample CD 2</h5>
<p class='item_Description'>
A class of simpleCart_total, will display the cart total value.
</p>
<span class='item_price'>$8.97</span>
<a class='item_add' href='javascript:;' id='s5'>Add to Cart</a>
<span class='item_thumb'>http://i604.photobucket.com/albums/tt130/metalner/simplexshop/ghostbusters.png</span>
</div>
<div id='cartTotal'>
<strong>Total: </strong><span class='simpleCart_total'>$43.47</span>
</div>
<!--Add a div with the class of simpleCart_items to display what is in the user's cart-->
<div class='simpleCart_items'/>
<!--use a class of simpleCart_empty to empty the cart and simpleCart_checkout to checkout -->
<a class='simpleCart_empty' href='javascript:;'>Empty Cart</a>
<a class='simpleCart_checkout' href='javascript:;'>Checkout</a>
<!--End #demoContainer-->
</div>
<div align='center'><a href='http://www.dankerizer.com/'>Blog and SEO Tips</a></div>
</body>
</html>
Tidak ada komentar:
Posting Komentar