<html>
<head>
<title>Latihan Jam Ketujuh</title>
<link href="latihan7.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-1.7.2.js"></script>
<script type="text/javascript" src="js/ui/jquery.effects.core.js"></script>
<script type="text/javascript" src="js/ui/jquery.effects.bounce.js"></script>
<script type="text/javascript" src="js/ui/jquery.effects.clip.js"></script>
<script type="text/javascript" src="js/ui/jquery.effects.drop.js"></script>
<script type="text/javascript" src="js/ui/jquery.effects.explode.js"></script>
<style type="text/css">
.toggler { width: 600px; height: 300px; }
#button { padding: .5em 1em; text-decoration: none; }
#effect {
width: 400px;
height: 150px;
padding: 0.4em;
position: relative;
font-weight: bold;
font-style: italic;
font-family: "Times New Roman", Times, serif;
color: #000;
}
#effect h3 { margin: 0; padding: 0.4em; text-align: center; }
</style>
<script type="text/javascript">
$(function() {
function tampil(){
var pilih = $('#effectTypes').val();
var options = {};
$("#effect").toggle(pilih,options,350);
};
$("#button").click(function() {
tampil();
return false;
});
});
</script>
<style type="text/css">
<!--
.style1 {color: #0000FF}
-->
</style>
</head>
<body>
<div id="header">
</div>
<div id="pages">
<h2>Pages</h2>
<ul>
<li><a id="page1" href="#">login</a></li>
<li><a id="page2" href="#">register</a></li>
<li><a id="page3" href="#">topik</a></li>
<li><a id="page4" href="#">group</a></li>
<li><a id="page5" href="#">about</a></li>
</ul>
</div>
<div id="content">
<div id="colOne">
<div id="latest-post">
<h2 class="title style1">Selamat Datang </h2>
<h2 class="title style1">
</h2>
<div class="story"> <img src="latihan7.gif" alt="" width="180" height="135" class="image" />
</div>
</div>
<div id="recent-posts">
<div class="toggler">
<div id="effect" class="ui-widget-content ui-corner-all">
<p> Javascript merupakan bahasa pemrograman web yang berbasis script. Menggunakan javascript dalam pemrograman web dapat menciptakan sebuah web dengan tampilan dan kinerja yang dinamis dan interaktif.
Seiring perkembangan zaman, perkembangan dan cara penerapan pemrograman kode javascript juga semakin maju dan mudah untuk diapresiasikan. Kemudahan ini melahirkan sebuah metoda "query" yang menciptakan library dari kumpulan fungsi-fungsi javascript sehingga mudah untuk digunakan. </p>
</div>
</div>
<select name="effects" id="effectTypes">
<option value="bounce">Bounce</option>
<option value="clip">Clip</option>
<option value="drop">Drop</option>
<option value="explode">Explode</option>
</select>
<input type="button" id="button" value="Tampilkan Efek">
</div>
</div>
</body>
</html>
untuk CSS nya silahkan copas di halaman selanjutnya
Posts
No comments:
Post a Comment