Senin, 16 April 2012

Penjelasan Script Web HTML

  Agus Nur Ikhsan       Senin, 16 April 2012



SCRIPT HOME.HTML

Yang dilingkari warna merah itu menandakan IMAGE yang ada diWEB ini
Dan script nya ini :
Ini untuk gambar HEADER & TOMBOL MENU
<tr>
    <td colspan="2" background="img/ts5.jpg" width="950" height="175"><center>
      <p><h2> AGUS NUR IKHSAN</h2>
      <p>&nbsp;</p>
      <p>&nbsp;</p>
    </center>
  <p>
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="150" height="40" title="home">
      <param name="BGCOLOR" value="" />
      <param name="movie" value="button1.swf" />
      <param name="quality" value="high" />
      <embed src="button1.swf" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="105" height="23" ></embed>
        </object>
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="150" height="40" title="About">
      <param name="BGCOLOR" value="" />
      <param name="movie" value="button2.swf" />
      <param name="quality" value="high" />
      <embed src="button2.swf" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="105" height="23" ></embed>
    </object>
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="150" height="40" title="contact">
      <param name="BGCOLOR" value="" />
      <param name="movie" value="button3.swf" />
      <param name="quality" value="high" />
      <embed src="button3.swf" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="105" height="23" ></embed>
    </object>
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="150" height="40" title="Fands Club">
      <param name="BGCOLOR" value="" />
      <param name="movie" value="button4.swf" />
      <param name="quality" value="high" />
      <embed src="button4.swf" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="105" height="23" ></embed>
    </object>
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="150" height="40" title="Video">
      <param name="BGCOLOR" value="" />
      <param name="movie" value="button5.swf" />
      <param name="quality" value="high" />
      <embed src="button5.swf" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="105" height="23" ></embed>
    </object>
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="150" height="40" title="Album">
      <param name="BGCOLOR" value="" />
      <param name="movie" value="button6.swf" />
      <param name="quality" value="high" />
      <embed src="button6.swf" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="105" height="23" ></embed>
    </object></td>
  </tr>
Ini untuk gambar sebelah  KANAN
<tr>
            <td><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image2','','img/ts7.jpg',1)"><img src="img/ts6.jpeg" name="Image2" width="250" height="150" border="0" id="Image2" /></a></td>
          </tr>
        </table>
        <table width="200" border="1">
  <tr>
    <td><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image1','','img/ts4.jpg',1)"><img src="img/ts3.jpg" name="Image1" width="250" height="150" border="0" id="Image1" /></a></td>
  </tr>
</table>
        <table width="200" border="1">
          <tr>
            <td><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image3','','img/umang-island-w-java.jpg',1)"><img src="img/gili-island-300x191.jpg" name="Image3" width="250" height="150" border="0" id="Image3" /></a></td>
          </tr>
JADI untuk menampilkan gambar di WEB masukan script “img src=”Nama file.jpg+Lokasi Album


KET Gambar yang dilingkari:
1.       Menu Navigasi yang ada diweb, Menu itu diBuat menggunakan Flash yang sudah ada diMacromedia Dreamweaver 8
Ini contoh cara pembuatannya

Klik logo Flash yang ada diDreamweaver, pilih insert “flash button”, kemudian tinggal dimasukan sesuai keinginan, bisa dipilih juga model untuk tombol navigasi nya

Dan ini SCRIPTNYA:
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="138" height="32" title="Home">
        <param name="BGCOLOR" value="#020911" />
        <param name="movie" value="button1.swf" />
        <param name="quality" value="high" />
        <embed src="button1.swf" width="138" height="32" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" bgcolor="#020911" ></embed>
      </object>
      (ini hanya SCRIPT untuk satu tombol Navigasi saja)

2.       Gambar  “Sasuke” yang bisa berubah pada saat kursor mouse berada diIMAGE tersebut
Contoh pembuatannya


Klik Logo Image seperti pada contoh yang dilingkari warna merah, pilih “ROLLOVER Image”,kemudian dibrowse gambar yang mau dipilih, seperti pada contoh anak panah diatas, masukkan juga gambar ke-2 nya dibawah gambar pertama, klik OK
Ini “SCRIPT” nya :
<a href="CPP.flv" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image5','','Alone_in_the_dark___Naruto___by_CrazyCowCo.jpg',1)"><img src="2130019552_457a3bb7e5.jpg" name="Image5" width="158" height="448" border="0" id="Image5" /></a></td>
(ONMOUSEOVER pada saat mouse berada diatas suatu elemen form)
(ONMOUSEOUT pada saat mouse bergerak keluar dari area form)
(A HREF=”#” sebagai pemanggilan file)

“FOOTER”


Yang ditunjukan panah merah itu merupakan FOOTER untuk WEB ini
SCRIPT-nya sebagai berikut:
<img src="All_ALone_With_My_Guitar_by_lowendufour90.jpg" width="765" height="164" /></td>


“SCRIPT CONTACT.HTML”

Disini bagian table tengah nya aku masukkan SCRIPT CSS
Penjelasannya beserta SCRIPT:
Ditulis dengan warna BIRU sebagai keterangan maksud SCRIPT

<td width="421" rowspan="2" valign="top"><body class="bo">
      <div id = "all">(Untuk Mendeskripsikan semua bagian css disini menjadi satu macam saja)
    <div id="header">(Untuk Mendeskripsikan Bagian HEADER saja)
       <font color="#0000FF">(FONT COLOR sebagaia pemberian Warna pada tulisan #0000FF=BIRU)
Watashi wa "San" desu
      <i> <marquee>Arigatho ghozaimasu</marquee>(MARQUEE=TULISAN BERJALAN)
</i>    </div>
  
          <div id="kiri"> (Untuk Mendeskripsikan Bagian Kiri saja)

            <div id="navigasi"><center> (Untuk Mendeskripsikan Bagian Navigasi saja)

              <font color="#0000FF">Link-Link</center>
          
         - Search Engine -
              <ul class="u">
                <li><a href="http://www.google.com" target="_blank"> Google </a></li>
           <li><a href="http://www.yahoo.com" target="_blank"> Yahoo </a></li>
           </ul>
          
        
         - Social Network -
           <ol class="o">
             <li> <a href="http://www.google.co.id/" target="_blank">Facebook </a></li>
           <li> <a href="http://www.twitter.com" target="_blank">Twitter </a></li>
           </ol>
            </div>
                                   
                                 - Link Mahasasiswa-
            <ol class="k">
              <li> <a href="http://tif.uad.ac.id" target="_blank">
(untuk membuat link kesitus yang dimaksud disini TIF)” 
Pendaftaran Mahasiswa</a></li>
           <li> <a href="http://simeru.uad.ac.id" target="_blank">Simeru</a></li>
           </ol>
          </div>
            <div id="isi">(Untuk Mendeskripsikan Bagian ISI saja)
Penjelasan Singkat Tentang CSS    
              <br>
              <font class="c" size="3">
                CSS (Cascading Style Sheet) 
                adalah standard pembuatan dan pemakaian style untuk dokumen terstruktur , CSS digunakan untuk
                mempersingkat penulisan tag HTML seperti font,color,text, dan table menjadi lebih ringkas sehingga tidak
                terjadi pengulangan tulisan.</font></div>
  </div>
  </div>
      <div id="footer"> ((Untuk Mendeskripsikan Bagian FOOTER saja)
        &copy; Sandiah Corporiton       </div> (&copy untuk membuat LOGO COPYRIGHT)
        </div>
        <p>


“FANS_CLUB.HTML”
INPUT PENDAFTARAN DAN OUTPUT PENDAFTARAN
DALAM BENTUK  JAVA_SCRIPT
<b>
<h1 align="center">(ALIGN sebagai pengatur posisi disini menggunakan “CENTER” jadi posisinya ditengah) (H1 sebagai pengaturan ukuran huruf)
Form Pendaftaran</h1>
</b>
<form name="input">
<table border="0" bgcolor=violet align="center">
(TABEL BORDER sebagai pengaturan ketebalan sisi-sisi pada table)
(BGCOLOR sebagai pengaturan untuk mewarnai background table)
<tr>
<td>Nama</td><td> : </td>
<td> <input type="text" name="inama" size="30"/> </td>
(INPUT TEXT sebagai penginputan dalam bentuk text)
(NAME=”#” sebagai pemanggilan fungsi)
(SIZE=”#” untuk membuat ukuran huruf)

</tr>
<tr>
<td>Alamat</td><td> : </td>
<td> <input type="text" name="ialamat" size="30"/> </td>
</tr>
<tr>
<td>Telp</td>
<td> :  </td>
<td> <input type="text" name="itelp" size="30"/> </td>
</tr>
<tr>
<td>Jenis Kelamin</td><td> : </td>
<td>
<input type="radio" name="ijekal" value=Laki-Laki/>Laki-Laki
<input type="radio" name="ijekal" value=Perempuan/>Perempuan</td>
(INPUT TYPE=”RADIO” merupakan script fungction selector)
</tr>
<tr>
<td>Agama</td><td> : </td>
<td>
<select name="iagama">
<option>--pilih--</option>
<option value="Islam">Islam</option>
<option value="Kristen">Kristen</option>
<option value="Katolik">Katolik</option>
<option value="Hindu">Hindu</option>
<option value="Budha">Budha</option>
(OPTION VALUE untuk membuat menu pilihan )
</select>
</td>
</tr>
<tr>
<td>Prestasi yang pernah diraih</td><td> : </td>
<td><textarea name="iprestasi" cols="25" rows="5"></textarea></td>
</tr>
<tr>
<td colspan="3" align="right">
<input type="button" value="Simpan" onClick="sukma();"/>
(onClick pada saat pengguna melakukan klik )
<input type="reset" value="Batal"/>
</td>
</table>
</form>
<b>

<h1 align="center">Output Form Pendaftaran</h1>
</b>

<form name="output">
<table border="0" align="center">
<tr>
<td>Nama </td><td> : </td>
<td><input type="text" name="onama" size="30"/> </td>
</tr>
<tr>
<td>Alamat </td><td> : </td>
<td><input type="text" name="oalamat" size="30"/> </td>
</tr>
<tr>
<td>Telepon </td><td> : </td>
<td><input type="text" name="otelp" size="30"/> </td>
</tr>
<tr>
<td>Jenis Kelamin </td><td> : </td>
<td><input type="text" name="ojekal" size="30"/> </td>
</tr>
<tr>
<td>Agama </td><td> : </td>
<td><input type="text" name="oagama" size="30"/> </td>
</tr>
<tr>
<td>Prestasi yang pernah diraih </td><td> : </td>
<td><textarea name="oprestasi" cols="25" rows="5"></textarea></td>
</tr>  
</table>
</form></p>


“SCRIPT ABOUT.HTML”
<td width="421" rowspan="2"><p><font color="#0000FF"><li type="circle">Nama: Ahsan A.
(TD WIDTH untuk membuat ukuran table)
(li TYPE=”CIRCLE” untuk membuat start  a circle list)
Sandiah</li>
<li type="circle">Alamat: Jln. Muja Muju No.618</li>
<li type="circle">TTL: Manado, 19 February 1993</li>
<li type="circle">Jenis kelamin: Laki-laki</li>
<li type="circle">Agama: Islam</li>
<li type="circle">Kebangsaan: Indonesia</li>
<li type="circle">Alamat E-mail: ahsan_10018133@yahoo.co.id</li>
<li type="circle">Alamat Blogger: <a href="http://manadosoft.blogspot.com" target="_blank">Manadosoft</a></li></div><hr>
<div align="center"><u><b>Hobi<b></u></div><br>
<div align="left">
<li type="circle">Musik:Rock,alternative rock, pop rock</li>
<li type="circle">Olahraga:Futsal, sepak bola</li></div><hr>
<div align="center"><u><b>Pendidikan<b></u></div><br>
<div align="left">
<li type="circle">SD:SD Madrasah Ibtidaiyah Muhammadiya</li>
<li type="circle">SMP:SMP Muhammadiyah 1 manado</li>
<li type="circle">SMA:SMA Muhammadiyah 1 manado</li>
<li type="circle">Kuliah:Universitas Ahmad Dahlan</li>
<li type="circle">Fakultas Teknologi Industri</li>
<li type="circle">Jurusan Teknik Informatika</li></div><hr>
<div align="center"><u><b>Pengalaman Organisasi<b></u></div><br>
<div align="left">
<li type="circle">Mantan Ketua Bidang OSIS</li>
<li type="circle">Mantan Ketua OSIS</li>
<li type="circle">Ketua Pimpinan Daerah Ikatan Pelajar Muhammadiyah manado</li> 
<li type="circle">Ketua Pimpinan Wilayah Ikatan Pelajar Muhammadiyah manado</li>
<li type="circle">KULIAH:Anggota IMM UAD</li> </p>
      
logoblog

Thanks for reading Penjelasan Script Web HTML

Previous
« Prev Post

Tidak ada komentar:

Posting Komentar