jasa desain ruang dalam dan ruang luar. rumah, bangunan, perabot
+ Jasa Pasang KANOPI PVC Premium + Tukang Kanopi Berpengalaman

Posting Baru di Omasae.com









    Untuk hasil yang di atas, berikut adalah kode yang digunakan:
    HTML :

    
    <ul id="rPO"></ul>
    
    


    Anda bisa menambahkan css berikut ini untuk mengatur tampilannya. Untuk yang dishare di sini, ditambahkan keterangan yang menunjukkan fungsinya, agar bisa digunakan sebagai pelajaran, bagi yang membutuhkan.

    <style>
    ul#rPO { list-style: none; margin: 0; padding: 0; } li.rPO { display: block; clear: both; overflow: hidden; list-style: none; border-bottom: 1px solid #e3e3e3; word-break: break-word; padding: 10px 0; margin: 0; } li.rPO:last-child { border-bottom: 0; } li.rPO a { color: #444; } li.rPO a:hover { color: #44a; }
    </style>

    Keterangan:
    Baris 1-11: Mendefinisikan style untuk elemen ul#rPO dan li.rPO. list-style: none digunakan untuk menghilangkan tampilan default daftar, margin: 0 dan padding: 0 digunakan untuk menghilangkan margin dan padding default, display: block digunakan untuk membuat elemen li menjadi block-level, clear: both digunakan untuk menghindari floating pada elemen sebelumnya, overflow: hidden digunakan untuk menghindari overflow pada elemen, border-bottom: 1px solid #e3e3e3 digunakan untuk menambahkan border bawah pada setiap elemen li, word-break: break-word digunakan untuk memisahkan kata yang panjang sehingga tidak keluar dari kotak elemen, padding: 10px 0 digunakan untuk memberikan padding atas dan bawah pada elemen, margin: 0 digunakan untuk mengatur margin menjadi 0.
    Baris 12-13: Menambahkan style pada elemen terakhir pada daftar untuk menghilangkan border bawah.
    Baris 14-16: Mendefinisikan style untuk elemen a yang berada dalam elemen li.rPO. color: #444 digunakan untuk memberikan warna pada teks, color: #44a digunakan untuk memberikan warna pada teks ketika cursor berada di atas link.

    Dan inilah javascript yang diterapkan untuk menjalankan program ini.
    Javascript :

      
    <script>
    var nPo = 8;
    // Variabel untuk menyimpan jumlah postingan yang akan ditampilkan.
    
    function rP(a){
    // Fungsi untuk menampilkan postingan.
    if(document.getElementById("rPO")){
    // Jika element dengan id "rPO" ditemukan pada halaman, maka:
    var e=a.feed.entry,title,link,content="",ct=document.getElementById("rPO");
    // Variabel e digunakan untuk menyimpan isi dari feed postingan, sedangkan variabel title, link, dan content akan digunakan nanti.
    // Variabel ct digunakan untuk menyimpan element dengan id "rPO".
    for(var i=0;i<nPo;i++){
      // Looping untuk menampilkan postingan sebanyak nilai yang disimpan pada variabel nPo.
      
      for(var j=0;j<nPo;j++){
        // Looping untuk mengecek tautan alternatif dari postingan.
        
        if(e[i].link[j].rel=="alternate"){
          // Jika tautan alternatif ditemukan, maka:
          link=e[i].link[j].href;
          break;
        }
      }
      
      var title=e[i].title.$t;
      // Mengambil judul postingan dan menyimpannya pada variabel title.
      
      content+='<li class="rPO"><a href="'+link+'" title="'+title+'" target="_blank" rel="nofollow">'+title+'</a></li>'
      // Membuat tampilan postingan dalam bentuk daftar.
    }
    
    ct.innerHTML=content
    // Mengganti isi dari element dengan id "rPO" dengan daftar postingan yang sudah dibuat sebelumnya.
    }
    }
    
    var rcp=document.createElement('script');
    rcp.src='https://www.omasae.com/feeds/posts/summary?alt=json-in-script&orderby=published&max-results='+nPo+'&callback=rP';
    document.getElementsByTagName('head')[0].appendChild(rcp);
    // Membuat element script dan menambahkannya pada head dokumen HTML.
    // Script ini berfungsi untuk memuat data feed postingan dan memanggil fungsi rP untuk menampilkan data tersebut.
    </script>
      
    


    Terkait

    Jasa Desain, Bangun dan Renovasi : rumah, toko, warung, kantor, taman, interior, pagar, kanopi, furniture. Konsep spesial pribadi Anda. Lebih indah, hemat, mudah, ringan, dan aman



    Layanan Jasa Konstruksi dan Pengelasan