Ceriwis  

Go Back   Ceriwis > HOBI > Komputer & Teknologi > Teknologi > Tips & Trick

Reply
 
Thread Tools
  #1  
Old 14th July 2011
maximillianw's Avatar
maximillianw maximillianw is offline
Ceriwis Lover
 
Join Date: Mar 2011
Location: underground
Posts: 1,876
Rep Power: 39
maximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Guru
Default Tips & Trik Desain Web

Menampilkan keterangan pada link
Mungkin halaman web Anda mempunyai banyak link, sehingga jika tidak disertai keterangan yang jelas orang akan bingung, link tersebut akan menuju ke mana ? Dengan javascript berikut Anda dapat menambahkan keterangan untuk link Anda.
HTML Code:
                                  <script>
                                <!--
                                function showtip(tip){
                                document.tool.tip.value=tip
                                }
                                file://-->
                                </script>
                                 <A                                  href="http://www.lutfian.com" onMouseover="showtip('Download                                  freeware dan shareware!')" onMouseout="showtip('')">                                  Lutfian Software</A> 
Background warna pada teks
Mungkin Anda ingin menonjolkan tulisan tertentu pada halaman web Anda. Untuk itu Anda bisa memakai CSS berikut ini :


PHP Code:
<span style="background-color:yellow">Text                                  yang ada background warna </span
CSS di atas akan menghasilkan tulisan seperti di bawah ini :
Text yang ada background warna

Sedangkan untuk menampilkan background warna pada link, Anda perlu menambahkan kode berikut di antara tag <head> dan </head>.


PHP Code:
<style                                  type="text/css">
                                <!--
                                
A:hover {background-colororange}
                                -->
                                </
style



Last edited by maximillianw; 14th July 2011 at 09:18 AM.
Reply With Quote
  #2  
Old 14th July 2011
maximillianw's Avatar
maximillianw maximillianw is offline
Ceriwis Lover
 
Join Date: Mar 2011
Location: underground
Posts: 1,876
Rep Power: 39
maximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Guru
Default Membuat browser "menari"

Pengen membuat kejutan pada pengunjung web Anda ? Copy dan Paste kode di bawah ini ke dalam Notepad lalu simpan sebagai file HTML

Code:
<html>
                                      <HTML> 
                                      <HEAD> 
                                      <TITLE> Browser yang bisa menari</TITLE>                                        
                                      <script language="JavaScript"                                        type="text/javascript"> 
                                      function init() { 
                                      setTimeout("shake(3)",1000); 
                                      setTimeout("this.focus()",4000);                                        
                                      setTimeout("shake(3)",4100); 
                                      } 
                                      function register() 
                                      { 
                                      var isAol = "no"; 
                                      var res = 800 ; 
                                      } 
                                      function shake(n) { 
                                      if (self.moveBy) { 
                                      for (i = 10; i > 0; i--) { 
                                      for (j = n; j > 0; j--) { 
                                      self.moveBy(0,i); 
                                      self.moveBy(i,0); 
                                      self.moveBy(0,-i); 
                                      self.moveBy(-i,0); 
                                      } 
                                      } 
                                      } 
                                      } 
                                      a=275; 
                                      b=275; 
                                      r=20; 
                                      x=1; 
                                      z=1; 
                                      function rotate(r) { 
                                      while (z<=3) { 
                                      for (var i = 0; i <360; i++) { 
                                      x = (r * Math.cos((i * Math.PI)/180)) +                                        a; 
                                      y = (r * Math.sin((i * Math.PI)/180)) +                                        b; 
                                      window.moveTo(x,y); 
                                      } 
                                      z+= 1; 
                                      } 
                                      setTimeout("shake(3)",10000);                                        
                                      } 
                                      </script> 
                                      </HEAD> 
                                      <BODY ONLOAD="init()" BGCOLOR="Black">                                        
                                      </BODY> 
                                      </HTML> 
Menampilkan title pada link
Apakah Anda sudah tahu atribut "title" pada tag A HREF ? Atribut "title" tersebut berfungsi untuk menampilkan keterangan pada suatu link.



Contoh:
Code:
<a                                  href="myfile.htm" title="Download                                  freeware">Lutfian Software</a> 


Jika cursor mouse diarahkan ke link tersebut maka akan muncul keterangan "Download freeware"
Reply With Quote
  #3  
Old 14th July 2011
maximillianw's Avatar
maximillianw maximillianw is offline
Ceriwis Lover
 
Join Date: Mar 2011
Location: underground
Posts: 1,876
Rep Power: 39
maximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Gurumaximillianw is Ceriwis Guru
Default

Membuat tombol 3 dimensi
Kalau Anda rajin surfing pasti sudah sering melihat "tombol" yang dibuat dengan tag <TABLE> yang mempunyai efek 3 dimensi. Buat Anda yang belum pernah melihatnya,

Di bawah ini adalah contoh bagaimana membuat tombol sepeti itu:
Code:
<HTML>
                                <HEAD>
                                <TITLE> Tombol 3 Dimensi </TITLE>
                                </HEAD> 
                                <STYLE>
                                .link1:hover {
                                FONT-SIZE: 10px; COLOR: #f0f2f3; FONT-FAMILY:                                  Verdana,Arial; TEXT-DECORATION: underline
                                }
                                .link1 {
                                FONT-SIZE: 10px; COLOR: #f0f2f3; FONT-FAMILY:                                  Verdana,Arial; TEXT-DECORATION: none
                                }
                                .tabel1 {
                                BORDER-RIGHT: black 2px outset; BORDER-TOP: white                                  1px outset; BACKGROUND: #507488; BORDER-LEFT:                                  white 1px outset; BORDER-BOTTOM: black 2px outset
                                }
                                </STYLE>
                                 <BODY                                  bgcolor=#f0f2f3>
                                 <TABLE                                  align=center class=tabel1>
                                <TR><TD> <b><a class=link1                                  href=http://www.lutfian.com target=blank> Lutfian                                  Software </a></b> </TD></TR>
                                </TABLE>
                                 </BODY>
                                </HTML>
Bookmark dengan link
Anda pasti sering menjumpai link seperti "Bookmark situs ini", yang jika link tersebut kita klik maka akan langsung masuk ke dalam Favorites. Dengan memasukkan situs ke dalam Favorites, maka kita tidak perlu susah-susah lagi mengetikkan nama situs pada Address Bar, tapi cukup dengan mengklik nama situs yang terdapat pada daftar Favorites.

Untuk membuat link bookmark tersebut, masukkan kode di bawah ini di antara tag <HEAD> dan </HEAD> pada halaman web Anda:

Code:
<script                                        language="JavaScript1.2">
                                      <!-- Start
                                      var bookmarkurl="http://www.klik-kanan.com/"
                                      var bookmarktitle="Gudangnya ilmu komputer"
                                      function addbookmark(){if
                                       (document.all)window.external.AddFavorite                                         (bookmarkurl,bookmarktitle)}
                                      // End -->
                                      </script>

Setelah itu kita dapat membuat link yang akan "memanggil" kode javascript di atas:

Code:
<script                                        language="JavaScript">
                                      if (document.all)document.write('<a
                                      href="javascript:addbookmark()">Bookmark                                        Situs Ini!</a>')
                                      </script>
Harap diingat bahwa kode di atas hanya untuk browser Internet Explorer. Bagaimana jika si user menggunakan Netscape Navigator? Gunakan saja script di bawah ini:

Code:
<SCRIPT                                        language="JavaScript">
                                      <!-- Begin
                                      <!-- Script By Yousuf Imtiaz-->
                                      if (document.all) { // 
                                      var url="http://www.klik-kanan.com";
                                      var title="Gudangnya ilmu komputer";
                                      document.write('<A HREF="javascript:window.ext');
                                      document.write('ernal.AddFavorite(url,title);"                                        ');
                                      document.write('onMouseOver=" window.status=');
                                      document.write("'Bookmark Now!'; return                                        true ");
                                      document.write('"onMouseOut="                                        window.status=');
                                      document.write("' '; return true ");
                                      document.write('">Bookmark  Situs                                        Ini!</a>');
                                      }
                                      else {
                                      document.write("Bookmark Situs Ini!                                        (CTRL+D)");
                                      }
                                      // End -->
                                      </SCRIPT>
Reply With Quote
  #4  
Old 5th November 2011
ononiha ononiha is offline
Member
 
Join Date: Nov 2011
Posts: 96
Rep Power: 0
ononiha mempunyai hidup yang Normal
Default

terima kasih atas sharingnya
Reply With Quote
  #5  
Old 5th November 2011
paidjoireng paidjoireng is offline
Member Aktif
 
Join Date: Aug 2011
Posts: 161
Rep Power: 0
paidjoireng sebentar lagi akan terkenalpaidjoireng sebentar lagi akan terkenal
Default

ane bookmark dlo ndan..
thanks
Reply With Quote
  #6  
Old 6th November 2011
handysetiady handysetiady is offline
Banned
 
Join Date: Nov 2011
Posts: 96
Rep Power: 0
handysetiady mempunyai hidup yang Normal
Default

Nice inpo, ndan
Reply With Quote
  #7  
Old 6th November 2011
risers risers is offline
Member
 
Join Date: Nov 2011
Posts: 94
Rep Power: 0
risers mempunyai hidup yang Normal
Default

nice info
Reply With Quote
  #8  
Old 8th November 2011
kimpoi kimpoi is offline
Member
 
Join Date: May 2010
Posts: 88
Rep Power: 0
kimpoi mempunyai hidup yang Normal
Default

bookmark dlu...
Reply With Quote
  #9  
Old 9th November 2011
viericool viericool is offline
Member Aktif
 
Join Date: Aug 2011
Posts: 101
Rep Power: 0
viericool mempunyai hidup yang Normal
Default

nice info . .
Reply With Quote
  #10  
Old 9th November 2011
risa01 risa01 is offline
Member
 
Join Date: Jan 2011
Posts: 77
Rep Power: 0
risa01 mempunyai hidup yang Normal
Default

di coba dolo bro
Reply With Quote
Reply


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off


 


All times are GMT +7. The time now is 05:33 AM.


no new posts