joko siswanto

Rabu, 12 Maret 2014

Cara membuat permainan mencari kata berbasis html

ini script untuk membuat tulisannya berbeda warna
buat folder dengan nama css simpan script dibawah ini dengan nama tmukan.css didalam folder css
p:hover{color:red }
b:hover{color:green }

kemudia anda membuat script untuk tampilan permainannya
simpan script dibawah ini didalam folder css dengan nama level4.html
<html>
<head>
<title>LEVEL4</title>
<body background="logoku.bmp" oncontextmenu='return false;' onkeydown='return false;' onmousedown='return false;'>
<LINK REL="STYLESHEET"
TYPE="text/css" HREF="tmukan.css">
<table border="1" width="50%" height="500" align="center" bgcolor="black">
<tr valign="top">
<td><font color="red" face="verdana" size="4">Level 4</font>
<center><font color="red" size="7">TEMUKAN LAH !!!!!</font></center>
<table border="0" cellspacing="50" cellpadding="15" align="center" bgcolor="black">
<tr>
<td bgcolor="black" ><font color ="black" onclick="window.alert('SALAH!!!,KAMU KEMBALI KE LEVEL 1'),window.location.href='Level1.html'"><h2><span style="cursor:pointer"><p>NO</span></h2></font ></td>
<td bgcolor="black" ><font color ="black" onclick="window.alert('SALAH!!!,KAMU KEMBALI KE LEVEL 1'),window.location.href='Level1.html'"><h2><span style="cursor:pointer"><p>tidak</span></h2></font ></td>
<td bgcolor="black" ><font color ="black" onclick="window.alert('SALAH!!!,KAMU KEMBALI KE LEVEL 1'),window.location.href='Level1.html'"><h2><span style="cursor:pointer"><p>salah</span></h2></font ></td>
<td bgcolor="black"><font color ="black" onclick="window.alert('SALAH!!!,KAMU KEMBALI KE LEVEL 1'),window.location.href='Level1.html'"><h2><span style="cursor:pointer"><p>bukan</span></h2></font ></td>
</tr>
<tr>
<td bgcolor="black" ><font color ="black" onclick="window.alert('SALAH!!!,KAMU KEMBALI KE LEVEL 1'),window.location.href='Level1.html'"><h2><span style="cursor:pointer"><p>keliru</span></h2></font ></td>
<td bgcolor="black"><font color ="black" onclick="window.alert('SALAH!!!,KAMU KEMBALI KE LEVEL 1'),window.location.href='Level1.html'"><h2><span style="cursor:pointer"><p>bukan</span></h2></font ></td>
<td bgcolor="BLACK"><font color ="black" onclick="window.location.href='level5.html'"><h2><span style="cursor:pointer"><b>iya</span></h2></font ></td>
<td bgcolor="black"><font color ="black" onclick="window.alert('SALAH!!!,KAMU KEMBALI KE LEVEL 1'),window.location.href='Level1.html'"><h2><span style="cursor:pointer"><p>salah</span></h2></font ></td>
</tr>
<tr>
<td bgcolor="black" ><font color ="black" onclick="window.alert('SALAH!!!,KAMU KEMBALI KE LEVEL 1'),window.location.href='Level1.html'"><h2><span style="cursor:pointer"><p>keliru</span></h2></font ></td>
<td bgcolor="black"><font color ="black" onclick="window.alert('SALAH!!!,KAMU KEMBALI KE LEVEL 1'),window.location.href='Level1.html'"><h2><span style="cursor:pointer"><p>tidak</span></h2></font ></td>
<td bgcolor="black" ><font color ="black" onclick="window.alert('SALAH!!!,KAMU KEMBALI KE LEVEL 1'),window.location.href='Level1.html'"><h2><span style="cursor:pointer"><p>bukan</span></h2></font ></td>
<td bgcolor="black"><font color ="black" onclick="window.alert('SALAH!!!,KAMU KEMBALI KE LEVEL 1'),window.location.href='Level1.html'"><h2><span style="cursor:pointer"><p>no</span></h2></font ></td>
</tr>
</table>
</BODY>
</HTML>

NB: anda belum punya script html yang bernama level1.html dan level5.html anda buat dulu script html apapun disimpan menjadi satu difolder css tadi. good luck!

mau donwload klik download

CARA MEMBERI PESAN BOX PADA SUBMIT JIKA DI KLIK

Cara agar blog tidak bisa di CRTL+A CTRL+U CTRL+C

Selasa, 11 Maret 2014

CARA MEMBUAT KURSOR MENJADI JARI PADA KALIMAT YANG DIARAHKAN

MEMBUAT CSS

ini script untuk cssnya buat folder dengan nama css simpan script dibawah ini di folder css dengan nama skin.css
#head-menu{
margin:0 auto;
width: 803px;
height: 50px;
background-color:blue;
color: white;
border: 3px solid cyan;
}
#head-menu a:link, a:visited{
color:white;
text-decoration:none;
margin-left:5px;
margin-right:20px;
line-height:35px;
}
#head-menu a:hover{
background-color:orange;
line-height:35px;
}
#container{
margin:0 auto;
width: 790px;
background-color:black;
padding:5px;
min-height:350px;
height: auto;
color: black;
border: 3px solid cyan;
}
#footer{
margin:0 auto;
width: 800px;
height: 40px;
background-color:blue;
color:white;
text-align:center;
border: 3px solid cyan;
}
table td, th{
border:1px solid black;
}
th{
font-weight:bold;
}

buat script untuk memanggil cssnya scriptnya sebagai berikut
<html>
<head>
<title></title>
<link rel="stylesheet" href="css/skin.css"/>
</head>
<body>
<div id="head-menu"><center><font face="Lucida Calligraphy"> Asah Brain</font></center>
</div>
<div id="container">
<img src= "Brain.jpg" height="500px" width="780px">
</div>
</body>
</html>
simpan didalam folder css tadi dengan nama index.html
selamat mencoba

Cara membuat jam digital berbasis html dan javascript

<html>
<body>
<font face="Consolas">
<h1 id="waktu"></h1>
</font>
<script type="text/javascript">
function showClock()
{
thisTime = new Date();
jam = thisTime.getHours();
menit = thisTime.getMinutes();
detik = thisTime.getSeconds();
waktu = (jam > 9)? jam : "0"+jam;
waktu += (menit > 9)? ":"+menit : ":0"+menit;
waktu += (detik > 9)? ":"+detik : ":0"+detik;
document.getElementById("waktu").innerHTML = waktu;
setTimeout("showClock()", 200);
}
showClock();
</script>
</body>
</html>

Membuat Login Dengan CodeIgniter

CARA MEMBUAT LOGIN SEDERHANA MENGGUNAKAN CODEIGNITER

PESIAPAN
Pertama kalian harus mempunyai zip codeigniter disini saya menggunakan codeigniter 2.1.4.zip
extract file di xampp/htdocs/
Kedua kalian mempunyai web server disini saya menggunakan xampp

LANGKAH PERTAMA MEMBUAT DATABASE
buat terlebih dahulu databasenya di phpmyadmin disini saya mencontohkan membuat database dengan menggunakan nama db_user lalu isikan table dengan struktur sebagai berikut.

CREATE TABLE `users` (
`id` tinyint(4) NOT NULL AUTO_INCREMENT,
`username` varchar(10) NOT NULL,
`password` varchar(100) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

Lalu tambahkan data pada tabel users dengan struktur data sebagai berikut.
insert into users (username, password) values ('admin', MD5('nama'));

Mengkonfigurasi database di codeigniter
Update file application/config/database.php di folder codeigniter anda , lalu edit baris ini.

$db['default']['hostname'] = 'localhost';
$db['default']['username'] = 'root';
$db['default']['password'] = '';
$db['default']['database'] = 'db_user';
lalu disave.

Default Controller
Kita akan memberi tahu Codeigniter untuk mengarahkan halaman kita ke halaman login , update file application/config/routes.php di folder codeigniter anda dengan nama controller anda . disini saya akan membuat controller dengan nama login.
$route['default_controller'] = "login";
lalu disave.

Default Libraries
Rubah codenya di dalam file application/config/autoload.php anda dapat mengkonfigurasi library default yang akan anda pakai di semua controller anda , untuk saat ini , saya akan menggunakan database dan session library , yang digunakan untuk meng-handle session user dan juga url helper untuk pemrosesan linknya.
$autoload['libraries'] = array('database','session');
$autoload['helper'] = array('url');
lalu disave.

Encryption Key
Saat bila anda akan menggunakan library session, anda harus set encryption key pada file application/config/config.php.
$config['encryption_key'] = 'REALLY_LONG_NUMBER';
lalu disave

MEMBUAT SCRIPTNYA
Langkah Pertama buat user
<?php
Class User extends CI_Model
{
function login($username, $password)
{
$this -> db -> select('id, username, password');
$this -> db -> from('users');
$this -> db -> where('username', $username);
$this -> db -> where('password', MD5($password));
$this -> db -> limit(1);
$query = $this -> db -> get();
if($query -> num_rows() == 1)
{
return $query->result();
}
else
{
return false;
}
}
}
?>
lalu simpan di models dengan nama user.php(application/models/user.php)

Langkah Kedua Membuat Login
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class Login extends CI_Controller {
function __construct()
{
parent::__construct();
}
function index()
{
if($this->session->userdata('logged_in'))
{
redirect('home', 'refresh');
}
else
{
$this->load->helper(array('form'));
$this->load->view('login_view');
}
}
}
?>
lalu simpan di controller dengan nama login.php (application/controllers/login.php).

Langkah Ketiga memebuat validasi terhadap database
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class VerifyLogin extends CI_Controller {
function __construct()
{
   parent::__construct();
   $this->load->model('user','',TRUE);
}
function index()
{
   $this->load->library('form_validation');
   $this->form_validation->set_rules('username', 'Username', 'trim|required|xss_clean');
   $this->form_validation->set_rules('password', 'Password',
'trim|required|xss_clean|callback_check_database');
   if($this->form_validation->run() == FALSE)
   {
   $this->load->view('login_view');
   }
   else
   {
   redirect('home', 'refresh');
   }
}
function check_database($password)
{
   $username = $this->input->post('username');
   $result = $this->user->login($username, $password);
   if($result)
   {
   $sess_array = array();
   foreach($result as $row)
   {
   $sess_array = array(
   'id' => $row->id,
   'username' => $row->username
   );
$this->session->set_userdata('logged_in', $sess_array);
   }
   return TRUE;
   }
   else
   {
   $this->form_validation->set_message('check_database', ' username and password not found!');
   return false;
   }
}
}
?>
simpan di controllers dengan nama akulogin.php (application/controllers/akulogin.php).

Langkah  Keempat membuat halaman untuk user saja
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
session_start();
class Home extends CI_Controller {
function __construct()
{
   parent::__construct();
}
function index()
{
   if($this->session->userdata('logged_in'))
   {
   $session_data = $this->session->userdata('logged_in');
   $data['username'] = $session_data['username'];
   $this->load->view('home_view', $data);
}
   else
   {
   redirect('login', 'refresh');
   }
}
function logout()
{
   $this->session->unset_userdata('logged_in');
   session_destroy();
   redirect('home', 'refresh');
}
}
?>
simpan di controllers dengan nama home.php (application/controllers/home.php).

Langkah Kelima membuat Tampilan Login
<html>
<head>
<title>Simple Login menggunakan CodeIgniter</title>
</head>
<body>
<h1>Simple Login menggunakan CodeIgniter</h1>
<?php echo validation_errors(); ?>
<?php echo form_open('akulogin'); ?>
<label for="username">Username:</label>
<input type="text" size="20" id="username" name="username"/>
<label for="password">Password:</label>
<input type="password" size="20" id="passowrd" name="password"/>
<input type="submit" value="Login"/>
</form>
</body>
</html>
simpan di views dengan nama login_views.php(application/views/login_view.php).

Langkah Keenam membuat tampilan halama
<html>
<head>
   <title>Simple Login menggunakan CodeIgniter - Private Area</title>
</head>
<body>
   <h1>Home</h1>
   <h2>Selamat datang<?php echo $username; ?>!</h2>
   <a href="home/logout">Logout</a>
</body>
</html>
simpan di view dengan nama home_view.php (application/views/home_view.php)
sekian semoga sobat sukses menjalankannya selamat mencoba good luck!