Slide Out With jQuery Plug-In

Hai...hai...hai, selamat berjumpa kembali pada tradisi Beben si bloglang ganteng kalem :p Kalau tidak berbagi web-web yang oke punya, seperti biasa share trik tutorial yg gaya punya ;)) :)) Kali ini jatuh pada web dimana artikel dan informasinya sangat usefully :x Macam-macam jenis artikelnya sob ;) Ini dia thewebsqueeze :D Beben mau berbagi salah satu trik dari web tersebut mengenai "Slide-Out Feedback Button for the Side of a Webpage"

DEMO

Mantap!!! ;)) Itu buat Feedback, tapi kalo mo pasang apa saja bisa kok asal kreatifitas dikit ;)) Untuk memakai trik ini dibutuhkan 1kg terigu, 5 butir telor, 1kg mentega eh...:D Download terlebih dahulu gambar berikut Picture.

Harus memiliki javascript, minimal versi 1.3.2/jquery.min.js

<head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>

Kode CSS letakan sebelum kode ]]></b:skin>

#feedback {
display: none;
position: absolute;
top: 50px;
left: 0;
background-color: #0066CC;
height: 120px;
width: 360px;
margin: 0 0 0 -300px;
}
#feedback img {
position: absolute;
top: 0;
right: 0;
cursor: pointer;
}
h3 {
font-family: Verdana;
color: white;
}
form input, textarea {
display: block;
}

Masukan script plug-in sebelum/diatas tag </body>

Kode HTML letakan diantara tag <body>...</body>

<div id="feedback">
<h3>Your Title blah blah blah</h3>
<form>
<textarea>bleh bleh</textarea>
<input type="submit" value="Submit">
</form>
<img src="FEEDBACK.PNG">
</div>

Save.

Slide Out With jQuery Plug-In

Slide Out With jQuery Plug-In

2 comments

My ETC

KATEGORI

Contact Form Beben

MISC

Resources

FACEBOOK PAGE