Senin, 04 Juni 2012

JAVA SCRIPT : Membuat Kalkulator 2


JAVA SCRIPT : Kalkulator 2

<html>
<head>
<title>anwari-kyu1</title>
<meta name="Programmer" content="Muhammad Anwari" />
<script language="javascript" type="text/javascript">
<!--
  var flag = false;
  function isi(num) {
    if (flag) calc.b.value += num;
    else calc.a.value += num;
  }
  function tambah()
  {
    calc.opr.value = ' + '
    flag = true;
    calc.b.focus()
  }
  function kurang()
  {
    calc.opr.value = ' - '
    flag = true;
    calc.b.focus()
  }
  function kosong()
  {
    calc.a.focus()
    calc.a.value=""
    calc.opr.value=""
    calc.b.value=""
    calc.c.value=""
    flag = false;
  }
//-->
</script>
<style type="text/css">
p {
  line-height:1.3em;
  color:#00CC00
}
</style>
</head>
<body bgcolor="#000000">
<body onload=kosong()>
<center>
<p style="padding:20px 0px 30px 0px"><font size="6">JavaScript Calculator</font></p>
<form name="calc">
  <table border="2" bordercolor="#CCFF33">
    <tr>
      <td>
      <input type="text" name="a" size="2" />
      <input type="text" name="opr" size="1" />
      <input type="text" name="b" size="2" /> =
      <input type="text" name="c" size="2" />
      <br/>
      </td>
    </tr>
    <tr>
      <td>
      <input type="button" name="one"   value="  1  " onClick="isi(1)" />
      <input type="button" name="two"   value="  2  " onClick="isi(2)" />
      <input type="button" name="three" value="  3  " onClick="isi(3)" />
      <input type="button" name="plus"  value="  +  " onClick="tambah()" />
      <br/>
      <input type="button" name="four"  value="  4  " onClick="isi(4)" />
      <input type="button" name="five"  value="  5  " onClick="isi(5)" />
      <input type="button" name="six"   value="  6  " onClick="isi(6)" />
      <input type="button" name="minus" value="  -  " onClick="kurang()" />
      <br/>
      <input type="button" name="seven" value="  7  " onClick="isi(7)" />
      <input type="button" name="eight" value="  8  " onClick="isi(8)" />
      <input type="button" name="nine"  value="  9  " onClick="isi(9)" />
      <br/>
      <input type="button" name="clear" value="  c  " onClick="kosong()" />
      <input type="button" name="zero"  value="  0  " onClick="isi(0)" />
      <input type="button" name="DoIt"  value="  =  " onClick="calc.c.value=eval(calc.a.value+calc.opr.value+calc.b.value)" />
      <br/>
      </td>
    </tr>
  </table>
</form>
<font face="pristina"size="7"color="#00FF00">
<p>Created by : <br/>Muhammad Anwari<br>STM Muhammadiyah Tasikmalaya</p><hr/></font>
<font face="rockwell"size="4"color="#00FF00">
<p>Kampung Situbeet Mangkubumi</p></font>
</center>
</body>
</html>

Save dengan nama kalkulator.html
Maka akan tampil gambar dibawah ini 


JAVA SCRIPT : Membuat Kalkulator 1

JAVA SCRIPT : Membuat Kalkulator

<html>
<head>
<script type='text/javascript'>
alert ("SELAMAT DATANG DI KALKULATOR SEDERHANA ^_^")
</script>
<script type='text/javascript'>
alert ("Anda Ganteng Sekali")
</script>
<title>anwari-kyu1</title>
<body background="anwari.jpg">
<b>
<center><font color="aqua"size="7">HASIL PERHITUNGAN DENGAN</font><font color="#0000FF"size="7"> JAVA SCRIPT</font></center><hr align="center"color="#FFFFFF"size="5"width="50%"><br>
<center><font color="white"size="6"face="comic sans ms">Muhammad Anwari</center></font><br>
<font color="white"size="3">
<script language="javascript">
var n1 = prompt ("Masukan Nilai 1","");
var n2 = prompt ("Masukan Nilai 2","");
alert ('anda telah memasukkan angka dengan benar');
document.write ("Nilai Pertama &nbsp;:&nbsp; "+n1+" "+"<br>");
document.write ("Nilai Kedua &nbsp;&nbsp;&nbsp;&nbsp;:&nbsp; "+n2+" "+"<br><br><br>");

c = eval(n1)+eval(n2)
document.write ("Penjumlahan &nbsp;&nbsp;&nbsp;= "+c+"<br>");

c = eval(n1)-eval(n2)
document.write ("Pengurangan &nbsp;&nbsp;= "+c+"<br>");

c = eval(n1)/eval(n2)
document.write ("Pembagian &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;= "+c+"<br>");

c = eval(n1)*eval(n2)
document.write ("Perkalian &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;= "+c+"<br>");

</script>
</head>
</body>
</html>

Simpan dengan nama kalkulator+prompt.html

CSS : Create Layout

CSS : Membuat Layout 

Nah pada materi CSS ini saya akan memberikan ilmu kepada anda tentang cara membuat Layout/tampilan agar tampilan WEB anda menjadi lebih keren, enak dipandang,ok daripada banyak basa basi langsung aja yuk praktek..!

1. Pertama buat file CSS nya terlebih dahulu, copas atau ketik ulang syntax css dibawah ini!
 
body {
margin:0;
padding:0;
background-color : #000000;
color : #FFFBF0;  
text-align:center;
font-family:Arial, Helvetica, sans-serif;
font-size:1em;
}

a{text-decoration:none; color : #3A3A3A;}
a : hover  {color : #FF0000;text-decoration:none;}

#centerColumn {
margin-top:2em;
margin-left: 6em;
margin-right:6em;
voice-family: "\"}\"";
voice-family: inherit;
margin-left:6em;                  
margin-right:6em;
padding:1em .5em 2em .5em;
background-color : #000000;
text-align:left;
border:2px solid #00FF00;
}

html>body #centerColumn {
margin-left:6em;
margin-right:6em;
}

#centerColumn h2 {
margin:0 0 -.5em 0;
padding:.75em 0 0 0;
font-size:1em;
letter-spacing:.1em;
}

#header {
margin:-1em -.5em 0 -.5em !important;
margin:-2em -1em 0 -1em;
padding:0 0 0 0;
height:5em;
background-color : #000000;
}

#header h1 {
margin:0 0 -.6em 0;
padding:.5em 0 0 1em;
font-size:1.5em;
letter-spacing:.1em;
}

#header h2 {
margin:0 0 0 0;
padding:1em 0 0 1.75em;
font-size:.9em;
font-weight:300;
letter-spacing:.1em;
}

#nav {
margin:0 0 1em 0;
padding:.4em 0 0 0;
background-color : #00FF00;
}

#nav ul {
margin:0;
padding:0;                                                         
list-style:none;
}

#nav li {
margin:0;
padding:.25em;
display:inline;
}

#footer {
position:relative;
bottom:0;
margin:5em 0 0 0;
padding:0;
height:4em;
line-height:4em;
text-align:center;
font-size:.7em;
background : #00FF00;
border-top:2px solid #FFFF00;
}

Setelah diketik atau di copas syntax css diatas, simpan dengan nama style.css

2. setelah membuat file css, kita buat file htmlnya, silahkan anda ketik atau copas syntax dibawah ini

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>anwari</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="style.css" media="screen" />
</head>
<body>
<div id="centerColumn">
  <div id="header">
    <h1>Welcome</h1>
    <h2>Anwari</h2>
  </div>
  <!--//end #headern//-->
  <div id="nav">
    <ul>
      <li><a href="rumah.html">Rumah</a></li>
      <li><a href="profil.html">Profil</a></li>
      <li><a href="about.html">About</a></li>
    </ul>
  </div>
  <!--//end #nav//-->
  <marquee><font size="6"color="red"face="chiller">Wilujeng Sumping</font></marquee>
<p><font color="#0000CC"size="3">
   Isi text</p>
Formulir
<ul>
 <li type="disc">Nama : Anwari</li>
 <li type="disc">Kelas : XI RPL 1</li>
 <li type="disc">Sekolah : STM Muhammadiyah</li>
</ul>
  <div id="footer"> <font size="4"><a target="_blank" href="anwari-kyu1.blogspot.com" title="anwari-kyu1">Muhammad Anwari</a></font></div>
  <!--//end #footer//-->
</div>
<!--//end #centerColumn//-->
</body>
</html>

Simpan dengan layout.html

Maka hasil tampilannya seperti dibawah ini
 

Jumat, 25 Mei 2012

Gambar Karate Kata

KATA
Kata merupakan bentuk/pola, kata dalam karate tidak hanya merupakan latihan fisik, tapi juga mengandung pelajaran tentang prinsip bertarung, setiap kata memiliki ritme gerakan dan pernafasan yang berbeda


KATA 1(Heian Shodan)

KATA 2(Heian Nidan)

KATA 3 (Heian Sandan)

KATA 4 (Heian Yodan)

KATA 5 (Heian Godan)

KATA UNSU
                                   
KATA KANKU DAI

KATA EMPI

KATA BASSAI SHO


KATA BASSAI DAI


KATA GOJUSHIHO - SHO


KATA HANGETSU


KATA JI'IN


KATA JION


KATA JITTE


KATA KANKU - SHO


KATA MEIKYO


KATA NIJUSHIHO


KATA SOCHIN


KATA TEKKI SHODAN

KATA TEKKI NIDAN

KATA TEKKI SANDAN

KATA WANKAN

KATA CHINTE




Belajar CSS

CSS, merupakan singkatan dari Cascading Style Sheet
Cara membuat file CSS harus berekstensi .CSS
Bisa dibuat di Notepad, Notepad ++, Macromedia Dreamweaver...

Berikut syntax dari CSS...

Cara Merubah Posisi Gambar
<html>
<head>
<style type="text/css">
body
{
background-image:url('anwari.jpg');
background-repeat:no-repeat;
background-position:right top;
margin-right:200px;
}
</style>
</head>
<body>
<h1>Assalamualaikum</h1>
<p>anwari-kyu1.blogspot.com</p>
<p>Muhammad Anwari</p>
</body>


Tampilan Gambar

<html>
<head>
<style type="text/css">
div.img
{
  margin: 2px;
  border: 1px solid #0000ff;
  height: auto;
  width: auto;
  float: left;
  text-align: center;
}
div.img img
{
  display: inline;
  margin: 3px;
  border: 1px solid #ffffff;
}
div.img a:hover img {border: 1px solid #0000ff;}
div.desc
{
  text-align: center;
  font-weight: normal;
  width: 120px;
  margin: 2px;
}
</style>
</head>
<body>


<div class="img">
 <a target="_blank" href="gambar1.html"><img src="gambar1.jpg" alt="anwari" width="110" height="90" /></a>
 <div class="desc">Contoh Gambar1</div>
</div>
</body>
</html>

Style Navbar Type Vertical

<html>
<head>
<style type="text/css">
ul
{
list-style-type:none;
margin:0;
padding:0;
}
a:link,a:visited
{
display:block;
font-weight:bold;
color:#FFFFFF;
background-color:#98bf21;
width:120px;
text-align:center;
padding:4px;
text-decoration:none;
text-transform:uppercase;
}
a:hover,a:active
{
background-color:#7A991A;
}
</style>
</head>

<body>
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#news">Profil</a></li>
<li><a href="#about">About</a></li>
</ul>
</body>
</html>

Style Navbar Type Horizontal

<html>
<head>
<style type="text/css">
ul
{
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;
}
li
{
float:left;
}
a:link,a:visited
{
display:block;
width:120px;
font-weight:bold;
color:#FFFFFF;
background-color:#98bf21;
text-align:center;
padding:4px;
text-decoration:none;
text-transform:uppercase;
}
a:hover,a:active
{
background-color:#7A991A;
}

</style>
</head>

<body>
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#news">News</a></li>
<li><a href="#about">About</a></li>
</ul>
</body>
</html>






Sabtu, 12 Mei 2012

Shortcut Keyboard Windows XP

Windows : Shortcut Keyboard Windows XP

 UntukPencet
Tetapkan fokus pada pemberitahuan Windows Key + B


Melihat properti untuk item yang dipilih


ALT + ENTER


Menampilkan properti dari objek yang dipilih


ALT + Enter


Siklus melalui item dalam urutan mereka dibuk


ALT + ESC


Tutup item aktif, atau keluar dari program aktif


 ALT + F4


Membuka menu shortcut untuk jendela aktif


ALT + SPACEBAR


Menampilkan menu sistem untuk jendela aktif


 ALT + SPACEBAR


Beralih di antara item yang terbuka


 ALT + TAB


Melaksanakan perintah yang sesuai atau pilih opsi yang sesuai pada kotak dialog


 ALT + Underlined letter


Menampilkan menu yang sesuai


 ALT + Underlined letter in a menu name


Pilih tombol jika pilihan aktif adalah sekelompok tombol pilihan dalam kotak dialog


Arrow keys


Lihat folder satu tingkat di My Computer atau Windows Explorer


BACKSPACE


Buka folder satu tingkat atas jika folder yang dipilih dalam simpan sebagai atau buka kotak dialog dalam kotak dialog.


BACKSPACE


Menyalin item yang dipilih


CTRL while dragging an item


Memilih semua item


CTRL + A


Menyalin item


CTRL + C


Pindahkan titik penyisipan ke awal paragraf berikutnya


CTRL + DOWN ARROW


Menampilkan start menu


CTRL + ESC


Tutup dokumen aktif dalam program yang memungkinkan Anda untuk memilikibeberapa dokumen buka secara bersamaan


CTRL + F4


Pindahkan titik penyisipan ke awal kata sebelumnya


CTRL + LEFT ARROW


Pindahkan titik penyisipan ke awal kata berikutnya


CTRL + RIGHT ARROW


Membuat shortcut untuk item yang dipilih


CTRL + SHIFT while dragging an item


Menyorot text untuk diblok


CTRL + SHIFT with any of the arrow keys


Pindah ke belakang melalui tab di kotak dialog


CTRL + SHIFT + TAB


Bergerak maju melalui tab di kotak dialog


CTRL + TAB


Pindahkan titik penyisipan ke awal paragraf sebelumnya


CTRL + UP ARROW


Paste


CTRL + V


Mencari item


CTRL + Windows Key + F


Cut


CTRL + X


Undo


CTRL + Z


Menghapus item


DELETE


Menampilkan bagian bawah jendela aktif


END


Lakukan perintah untuk opsi atau tombol aktif dalam kotak dialog


ENTER


Membatalkan program


ESC


Menampilkan bantuan


F1


Mengaktifkan menu bar dalam program yang aktif


F10


Mengubah nama


F2


Mencari file atau folder.


F3


Menampilkan daftar Alamat bar di My Computer atau Windows Explorer


F4


Menampilkan item dalam daftar aktif dalam kotak dialog


F4


Refresh


F5


Siklus melalui elemen layar dalam jendela atau pada desktop


F6


Menampilkan bagian atas jendela aktif


HOME


Beralih Tombol Mouse 


Left ALT +left SHIFT +NUM LOCK


Beralih Kontras Tinggi 


Left ALT + left SHIFT + PRINT SCREEN


Buka menu berikutnya ke kiri, atau menutup submenu


LEFT ARROW


Tutup pilihan saat ini jika itu diperluas, atau pilih folder induk


LEFT ARROW


Menampilkan item dalam daftar aktif dalam kotak dialog


F4 


Siklus melalui elemen layar dalam jendela atau pada desktop


F6


Buka menu berikutnya ke kiri, atau menutup submenu


LEFT ARROW


Tutup pilihan saat ini jika itu diperluas, atau pilih folder induk


LEFT ARROW


Menampilkan menu shortcut untuk item yang dipilih


Menu key


Beralih Toggle Keys


NUM LOCK for five seconds


Tampilkan semua subfolder di bawah folder yang dipilih


NUM LOCK + ASTERISK on numeric keypad (*)


Menutup folder yang dipilih


NUM LOCK + MINUS SIGN on numeric keypad (-)




Menampilkan isi dari folder yang dipilih




NUM LOCK + PLUS SIGN on numeric keypad (+)


Buka menu berikutnya ke kanan, atau membuka submenu


RIGHT ARROW


Tampilan pilihan saat ini jika itu roboh, atau pilih subfolder pertama


RIGHT ARROW


Beralih Filter Keys 


Right SHIFT for eight seconds


Beralih Sticky Keys


SHIFT five times


Mencegah CD bermain otomatis


SHIFT when you insert a CD into the CD-ROM drive


Pilih lebih dari satu item dalam sebuah jendela atau pada desktop, atau memilih teks di dalam dokumen


SHIFT with any of the arrow keys


Hapus item yang dipilih secara permanen tanpa menempatkan item dalam Recycle Bin


SHIFT + DELETE


Menampilkan menu shortcut untuk item yang dipilih


SHIFT + F10


Pindah ke belakang melalui pilihan dalam kotak dialog


SHIFT + TAB


Pilih atau menghapus kotak centang jika pilihan aktif adalah kotak centang di kotak dialog


SPACEBAR


Bergerak maju melalui pilihan dalam kotak dialog


TAB




Melaksanakan perintah yang sesuai




Underlined letter in a command name on an open menu




Menampilkan atau menyembunyikan menu Start




Windows Key




Mengunci komputer Anda jika Anda terhubung ke jaringan domain, atau beralihpengguna jika Anda tidak terhubung ke jaringan domain




Windows Key + L


Menampilkan kotak dialog System Properties


Windows Key + BREAK


Menampilkan desktop


Windows Key + D


Membuka mycomputer


Windows Key + E


Mencari file atau folder.


Windows Key + F


Menampilkan windows help


Windows Key F1


Minimalkan semua program


Windows Key + M


Membuka menu RUN


Windows Key + R


Mengembalikan diminimalkan jendela


Windows Key + Shift + M


Membuka Manajer Utility


Windows Key + U