ödevler

16 Eylül 2013 Pazartesi

23.09.2013:

Bugün iki gün önce verilen ödevimi artık tamamlıyorum.En son aşamasına geldim.

$('#button3').click(function(){
var bla = $('#text1').val();
alert(bla);

$("#ayrl").css('font-size',bla);
});

yukarıda buton3 e tıkladığımda input a girdiğim değeri h1 in yazı büyüklüğü olarak ayarladım.

$('#ayrl').hover(function()
{

location.reload();

});

yukarıda mouse ile h1 in üzerine geldiğimde sayfam sıfırlanıp eski haline geliyor...

Vee ödevim bittiii....

20.09.2013:

Bugün bir önceki gün verilen ödevimi program üzerinde yapmaya başladım.

$('#button').click(function(){

   $( this ).css("color","gray");
   $(this).css("background-color","white");
   $(this).css("font","35px");
    $( "#ayrl").css("color","gray");
   $( "#ayrl").css("background-color","white");
   $( "#ayrl").css("font","35px");
});

yukarıda ilk butonumu yapmakla başladım.butonuma tıklandığında tüm özellikleri butona ve h1 e atayacak.

$('#button1').click(function(){
$("#button1").css("color",$('select').val());
$("#ayrl").css("color",$('select').val());
});
$('#button2').click(function(){
$("#button2").css("background",$('select').val());
$("#ayrl").css("background",$('select').val());

});

$("#menü").click(function ()     {
$("#button1").css("color",$(this).val());
});
$("#menü1").click(function ()     {
$("#button2").css("background",$(this).val());
});
$(":selected").css("background-color","red");
$(":selected").css("background-color","yellow");
   $(":selected").css("background-color","pink");
    $(":selected").css("background-color","green");

yukarıda buton1 e ve buton2 ye tıklandığında olması gerekenleri yaptım.Buton1 tıkladığımda buton1 in ve h1 in yazı rengini seçilen renk olarak ayraladım. Buton2 ye tıkladığımda ise buton2 ve h1 in arkaplan rengini seçilen renk olarak ayarladım...

19.09.2013:

Bugün ki ödevim aşağıdaki görseli oluşturmak için araştırma yapmak.

Yukarıda ki görseli oluşturmam istenildi.Kısaca ödevin içeriğinden bahsedecek olursam;

İlk butona basıldığında h1 de tanımlı olan metin ve butonun kendi büyüklüğü 35 px ,rengi gri ve arka plan rengi ise beyaz olacak.
Renklerin olduğu bir select oluşturlup button 1 e tıklandığında h1 in ve buton1 in yazı rengi seçilen renk olacak.
Renklerin olduğu bir select daha oluşturulacak buton2 ye tıklandığında h1 in ve buton2 nin arkaplan rengi seçilen renk olacak.
Bir adet input umuz olacak ve buraya girilen değer button3 e tıklandığında ilk önce mesajla gösterilecek ardından h1 e yazı boyutu olarak atanacak.
Son olarak ise mouse ile h1 in üzerine geldiğimizde sayfa sıfırlanıp ilk haline gelecek.

Bugün görseli oluşturmak için ön araştırma yaptım...

11 Eylül 2013 Çarşamba

18.09.2013:

STOP() METODU

STOP():Hareket halindeki nesneleri durdurmaya yardımcı olur.

örnek:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

</script>
<script>
$(document).ready(function(){
$("#basla").click(function(){
    $("div").animate({height:300},3000);
    $("div").animate({width:300},3000);
});
$("#dur").click(function(){
    $("div").stop();
});
});
</script>
<title>stop ödev</title>
</head>

<body>

<p>
<button id="basla">basla</button>
<button id="dur">dur</button>
</p>

</body>

</html>

17.09.2013:


                               SİZE() METODU

   Sayfamızda tanımlamış olduğumuz elemanların sayısını göstermemize yardımcı olur. Cümlem biraz düşük olabilir kusura bakmayın kafamda toparlamak biraz zor oldu bu metodu :)...

örnek:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
alert($("li").size());
});
});

</script>
<title>size ödev</title>
</head>
<body>
<button>basla</button>
<ul>
<li>Coffee</li>
<li>Milk</li>
<li>Soda</li>
<li>salep</li>
</ul>
</body>
</html>

16.09.2013:

EACH() METODU

For döngüsü olarak düşünün , tek farkı ise each elementlerin toplamını kendi alıyor ve hepsini tek tek işliyor.

örnek:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
    $("li").each(function(){
      alert($(this).text())
    });
});
});
</script>
<title>each ödev</title>
</head>
<body>
<button>göster</button>
<ul>
<li>Coffee</li>
<li>Milk</li>
<li>Soda</li>
</ul>
</body>
</html>

13.09.2013:

VAL() METODU

Gerekli value özniteliği değeri belirtir.
Bu yöntem geri döndüğünde ilk eşleşen öğenin değerini ,nitelik değerine dödürür.

Bu tanımı ilk okuduumdada birşey anlamaıştım.Hala okuyorum birşey anlamıyorum.Örnekler olmasa idi val metodu hakkında hiçbirşey öğrenemezdim.

örnek:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

</script>
<script>
$(document).ready(function(){

$("button").click(function(){

$("input:text").val("melek");
});
});

</script>
<title>val ödev</title>
</head>

<body>

</body>

</html>

sonnnnn