About Me

Agus Haryanto,
Android Trainner,
GoogleMaps (JavaScript) Trainer
JQuery and JQuery Mobile Trainer
Java, Java Script and PHP Trainer
Freelance Developer Android
Freelance Developer Blackberry
Freelance Developer Web (GIS Googlemaps)
Freelance Developer SMS Gateway

jika ingin contact saya bisa emali ke agus.superwriter@gmail.com

ym: agus_h23

Pin BB : 2AD38B33

Facebook : Agus Haryanto


Article

Mengenal Selector JQuery Hierachi (prev ~ sibling)

Prev ~ Sibling

Matches all sibling elements after the “prev” element that match the filtering “siblings” selector.

Cocokkan semua elemen saudara kandung setelah “prev” elemen yang cocok dengan penyaringan “saudara kandung” pemilih.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="../jquery-latest.js"></script>

  <script>
  $(document).ready(function(){
    $("#prev ~ div").css("border", "3px groove blue");
  });
  </script>
  <style>
  div,span {
    display:block;
    width:80px;
    height:80px;
    margin:5px;
    background:#bbffaa;
    float:left;
    font-size:14px;
  }
  div#small {
    width:60px;
    height:25px;
    font-size:12px;
    background:#fab;
  }
  </style>
</head>
<body>
  <div>div (doesn't match since before #prev)</div>
  <div id="prev">div#prev</div>
  <div>div sibling</div>
  <div>div sibling <div id="small">div neice</div></div>
  <span>span sibling (not div)</span>
  <div>div sibling</div>
</body>
</html>

Perintah

$(“#prev ~ div”).css(“border”, “3px groove blue”);

digunakan untuk merubah border seluruh element div yang dituliskan setelah element dengan id prev dengan id maindalam artian kalau dalam silsilah keluarga element-element yang merupakan anak dari element dengan id=main yang ada di document HTML, bordernya diset dengan tebal 3 pixel dan warnanya merah dengan corak dotted.

Share

Leave a Reply

 

 

 

You can use these HTML tags

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Spam protection by WP Captcha-Free