Membuat Form Pencarian Google Voice Search

Google Voice Search

Google Voice Search

Fitur baru yangPengumuman Calon Asisten Praktikum Basisdata. Read more ... » dikeluarkan Google adalah GoogleTrik Aman Berinternet I. Read more ... » Voice Search , dimana dalamCara mengatasai Cannot modify header PHP. Read more ... » teknologi ini memungkinkan seseorang dapat mencari sesuatu hanya denganTUGAS STRUKTUR DATA KELAS SAMI. Read more ... » menggunakan suara, yang kemudian akan diterjemahkan kedalam Text, sehingga secara otomatis google akan mencari kata kunci berdasarkan apa yang di ucapkan oleh si pencari. Terlepas dari masalah teknologinya, blog burhanudin.web.id akan coba membagi bagaimana membuat form pencarian dengan Google Voice Search. Oke, langsung aja copy paste  aja source berikut ini :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Google Speak Ala Burhanudin</title>
<style type="text/css">
#kotak{
-webkit-border-radius:15px;
height:25px;
}
</style>
</head>

<body>
<center>

<FORM method=GET action=http://www.google.com/search>
<table bgcolor="#FFFFFF">
<tr>
	<td align="center">
		<a HREF=http://www.google.com/> <IMG SRC=http://www.google.com/logos/Logo_40wht.gif border="0" ALT="Google"></a>
	</td>
<tr>
	<td>
		<INPUT TYPE=text id="kotak" name=q size=70 maxlength=255 value="" x-webkit-speech onwebkitspeechchange="this.form.submit ();">
		<INPUT type=submit name=btnG VALUE="Search" id="kotak">
		<font size="+1" style="font-family:Verdana, Arial, Helvetica, sans-serif">
		<input type=hidden name=domains value="http://burhanudin.web.id/"><br>
		<input type=radio name=sitesearch value="" checked> Web Search
		<input type=radio name=sitesearch value="burhanudin.web.id">burhanudin.web.id <br>
		</font>
	</td>
</tr>
</tr>
</TABLE>
</FORM>
<br />&copy; 2011 <a href="http://burhanudin.web.id/">burhanudin</a>
</center>
</body>
</html>

NB :

Dari source diatas yang terpenting adalah source

x-webkit-speech onwebkitspeechchange="this.form.submit ();"

dari source tersebutlah akan muncul icon speak yang digunakan untukCara mengatasi Install DotNet 3.5 Windows 8. Read more ... » melakukan pencarian. Fitur ini hanya berjalan pada Google Chrome.

Demo :

http://burhanudin.web.id/Demo/search.html

Selamat mencoba by burhanudin

Posted in Html, Programing and tagged , , , , .