<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>jQuery+CSS3仿苹果手机iPhone锁屏解锁代码</title>
<script src="js/modernizr-2.js"></script>
<link href="css/iphone.css" rel="stylesheet" type="text/css" />
<script src="js/jquery.min.js"></script>
<script src="js/jquery-ui-1.8.16.custom.min.js"></script>
<script src="js/iphone.js"></script>
<link href="css/page.css" rel="stylesheet" type="text/css" />
</head>
<body><script src="/demos/googlegg.js"></script>
<div id="container">
<div class="main">
<div class="project">
<div class="site">
<h1>iPhone4 on pure CSS3!</h1>
<div class="iphone_container">
<div class="iphone">
<div class="iphone_light_gradient"></div>
<div class="iphone_power_button" id="iphone_power_button"></div>
<div class="iphone_voice_toogle"></div>
<div class="iphone_voice_plus"></div>
<div class="iphone_voice_minus"></div>
<div class="iphone_camera"></div>
<div class="iphone_dynamic"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></div>
<div class="iphone_black_bg"></div>
<div class="iphone_display" >
<div class="iphone_headline" id="iphone_headline">
<div class="iphone_net"></div>
<div class="iphone_net_title">tjrus</div>
<div class="iphone_wi-fi">
<div class="hack"></div>
</div>
<div class="iphone_clock" id="iphone_headline_clock">00:00</div>
<div class="iphone_lock"></div>
<div class="iphone_battery"></div>
</div>
<div class="iphone_header" id="iphone_lock_header">
<div class="iphone_time" id="iphone_lock_time">0<span>:</span>00</div>
<div class="iphone_date" id="iphone_lock_date"></div>
</div>
<div class="iphone_footer" id="iphone_lock_footer">
<div class="iphone_unlock" id="iphone_unlock">
<div class="iphone_slider" id="iphone_slider"></div>
<div class="iphone_slide2unlock" id="iphone_slide2unlock">slide to unlock</div>
</div>
</div>
<div class="iphone_icons_containter" id="iphone_icons_containter">
<div class="icon">
<div class="i_message">
<div class="bg_angled"></div>
<div class="bulb"></div>
<div class="tail"></div>
<div class="hack"></div>
</div>
<span>Message</span> </div>
<div class="icon">
<div class="i_calendar">
<div class="day" id="iphone_icon_day"></div>
<div class="day_num" id="iphone_icon_day_num"></div>
</div>
<span>Calendar</span> </div>
<div class="icon">
<div class="i_clock">
<div class="gray_blick"></div>
<div class="center_dot"></div>
<div class="minute"></div>
<div class="second"></div>
<div class="hour"></div>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
<li>10</li>
<li>11</li>
<li>12</li>
</ul>
</div>
<span>Clock</span> </div>
<div class="icon">
<div class="i_notes"></div>
<span>Notes</span> </div>
<div class="icon">
<div class="i_reminders">
<div>✔</div>
<div>✔</div>
<div>✔</div>
</div>
<span>Reminders</span> </div>
<div class="icon">
<div class="i_mail">
<div class="mail">
<div class="mail_top"></div>
<div class="mail_bottom"></div>
</div>
<div class="clouds"><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b></div>
<div class="clouds2"><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b><b></b></div>
</div>
<span>Mail</span> </div>
<div class="icon">
<div class="i_app_store">
<div class="kirpich">
<div class="pen1"></div>
<div class="pen2"></div>
</div>
<div class="glow">
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
<hr />
</div>
</div>
<span>App Store</span> </div>
<div class="icon">
<div class="i_videos">
<div class="top">