<html>
<head>
<title>EZGÄ°FÄ°DAN</title>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<style>
.ezgi{padding:20px 500px;display:block;background:orange; }
.fidan{padding:20px 500px;display:block;background:orange;}
.tansu{padding:20px 500px;display:block;background:orange;}
.ozge{padding:20px 500px;display:block;background:orange;}
.a{padding:10px 10px;display:block;background:yellow;}
.b{padding:10px 10px;display:block;background:yellow;}
.c{padding:10px 10px;display:block;background:yellow;}
.d{padding:10px 10px;display:block;background:yellow;}
.e{padding:10px 10px;display:block;background:yellow;}
.f{padding:10px 10px;display:block;background:yellow;}
.g{padding:10px 10px;display:block;background:yellow;}
.h{padding:10px 10px;display:block;background:yellow;}
span {color:red;}
body { cursor:pointer; min-height: 100px; }
div { width:50px; height:30px; margin:5px; float:left; background:blue; }
</style>
</head>
<body>
<ul>
<li><a href="#" class="ezgi">Hakkimda</a></li>
<li><a href="#" class="fidan">Anasayfa</a></li>
<li><a href="#" class="tansu">Urunler</a></li>
<ul>
<li><a href="#" class="a">Urun1</a></li>
<li><a href="#" class="b">Urun2</a></li>
<li><a href="#" class="c">Urun3</a></li>
<li><a href="#" class="d">Urun4</a></li>
<li><a href="#" class="e">Urun5</a></li>
<li><a href="#" class="f">Urun6</a></li>
<li><a href="#" class="g">Urun7</a></li>
<li><a href="#" class="h">Urun8</a></li>
</ul>
<li><a href="#" class="ozge">Bilgilerim</a></li>
</ul>
<button id="a.a">fadeout</button>
<script>
$("a.ezgi").click(function(){
alert('Hakkimda bolumu')
});
$("a.fidan").click(function(){
alert('Hakkimda bolumu')
});
$("a.tansu").click(function(){
$("a.ozge").show(1000)
});
$("a.ozge").click(function(){
$(this).hide(1000)
});
$("a.a").click(function () {
$("a.a").fadeOut("slow");
});
$("a.b").click(function () {
$("a.a").fadeIn("slow");
});
$("a.c").click(function(){
$("a.c").fadeTo('fast',0.5);
});
$(document.body).click(function () {
if ($("a.d:first").is(":hidden")) {
$("a.d").show("slow"); } else {
$("a.d").slideUp(); } });
$(document.body).click(function () {
if ($("a.e:first").is(":hidden")) {
$("a.e").slideDown("slow");} else {
$("a.e").hide();}});
$( "a.f" ).click(function() {
$( "a.f" ).animate({
width: "70%", opacity: 0.4,
marginLeft: "0.6in", fontSize: "3em",
borderWidth: "10px" }, 1500 );});
$(document.body).click(function() {
$(this).append( $("<div>") );
var n = $("div").size();
$("span").text("Ezgi " + n + ".");});
</script>
<span></span>
<div></div>
</body>
</html>
Sekmeleri teker teker çalıştırdığımızda çıkan sonuç;
Hiç yorum yok:
Yorum Gönder