M-S Blog

Cara Membuat Jam, Hari dan Tanggal dengan Javascript di Blog

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEha4qUpV3EM_AXmQibmohC4lJL07Hg2PHXJrrSMBmC06okjXruyWhVTvle3Zil7xitL58N-2PAFTI2ea2UvO7xqDEVD23C4aK7ENtzeE6ogv4tPFyzVzUJ5g7n8OEbI7Tc86IagMnzkcYeb/s1600/images+(2).jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara Membuat Jam, Hari dan Tanggal dengan Javascript di Blog" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEha4qUpV3EM_AXmQibmohC4lJL07Hg2PHXJrrSMBmC06okjXruyWhVTvle3Zil7xitL58N-2PAFTI2ea2UvO7xqDEVD23C4aK7ENtzeE6ogv4tPFyzVzUJ5g7n8OEbI7Tc86IagMnzkcYeb/s1600/images+(2).jpg" title="Cara Membuat Jam, Hari dan Tanggal dengan Javascript di Blog" /></a></div>
 
Cara Membuat/Menampilkan Jam, Hari & Tanggal dengan Javascript - Jam, Hari dan Tanggal (Waktu) tidak lepas dari kehidupan, Pada kesempatan kali ini saya ingin berbagi pengetahuan tentang "Bagaimana Cara Membuat/Menampilkan Jam dan Tanggal dan Hari dengan JavasScript" .. 
 
CEKIDOT...... 
<div style="color: #333333; font-family: 'Open Sans', 'Trebuchet MS', Helvetica, sans-serif; font-size: 15px; line-height: 23.09375px;">
 
Berikut Pilihan Javascript untuk Menampilkan Jam / Tanggal / Hari , sesuai dengan kebutuhan sobat : </div>
<h2 style="border-top-color: rgb(51, 51, 51); border-top-style: dashed; border-top-width: 1px; color: #222222; font-family: Coda, cursive; font-size: 20px; line-height: 1.2em; margin: 0em 0px 0px; padding-top: 10px;">
Cara Menampilkan Tanggal dengan Javascript :</h2>
<blockquote style="background-color: #f0f0f0; border-color: rgb(204, 204, 204) rgb(204, 204, 204) rgb(204, 204, 204) rgb(51, 51, 51); border-style: solid; border-width: 1px 1px 1px 4px; color: #111111; font-family: Coda, cursive; font-size: 17px; line-height: 23.09375px; margin: 10px 0px; padding: 10px 50px; position: relative;">
<pre style="white-space: pre-wrap; width: 645px; word-wrap: break-word;"><code class="xml" style="color: black; display: block; font-family: Coda, cursive; padding: 0.5em;">
<script type='text/javascript'>

</script></code></pre>
</blockquote>
<center style="color: #333333; font-family: 'Open Sans', 'Trebuchet MS', Helvetica, sans-serif; font-size: 15px; line-height: 23.09375px;">
Hasilnya :  
<div style="background-color: #fbfbfb; border: 5px solid rgb(255, 255, 255); box-shadow: rgb(204, 204, 204) 1px 1px 5px; font-weight: bold; padding: 5px; width: 525px;">
<script type="text/javascript">

</script></div>
</center>
 
<h2 style="border-top-color: rgb(51, 51, 51); border-top-style: dashed; border-top-width: 1px; color: #222222; font-family: Coda, cursive; font-size: 20px; line-height: 1.2em; margin: 0em 0px 0px; padding-top: 10px;">
Cara Menampilkan Hari dan Tanggal dengan Javascript :</h2>
<blockquote style="background-color: #f0f0f0; border-color: rgb(204, 204, 204) rgb(204, 204, 204) rgb(204, 204, 204) rgb(51, 51, 51); border-style: solid; border-width: 1px 1px 1px 4px; color: #111111; font-family: Coda, cursive; font-size: 17px; line-height: 23.09375px; margin: 10px 0px; padding: 10px 50px; position: relative;">
<pre style="white-space: pre-wrap; width: 645px; word-wrap: break-word;"><code class="xml" style="color: black; display: block; font-family: Coda, cursive; padding: 0.5em;"><script type='text/javascript'>

</script></code></pre>
</blockquote>
<center style="color: #333333; font-family: 'Open Sans', 'Trebuchet MS', Helvetica, sans-serif; font-size: 15px; line-height: 23.09375px;">
Hasilnya :  
<div style="background-color: #fbfbfb; border: 5px solid rgb(255, 255, 255); box-shadow: rgb(204, 204, 204) 1px 1px 5px; font-weight: bold; padding: 5px; width: 525px;">
<script type="text/javascript">

</script></div>
</center>
 
<h2 style="background-color: #fbfbfb; border-top-color: rgb(51, 51, 51); border-top-style: dashed; border-top-width: 1px; color: #222222; font-family: Coda, cursive; font-size: 20px; line-height: 1.2em; margin: 0em 0px 0px; padding-top: 10px;">
Cara Menampilkan Jam saat ini! dengan Javascript ( Pasif ) :</h2>
<blockquote style="background-color: #f0f0f0; border-color: rgb(204, 204, 204) rgb(204, 204, 204) rgb(204, 204, 204) rgb(51, 51, 51); border-style: solid; border-width: 1px 1px 1px 4px; color: #111111; font-family: Coda, cursive; font-size: 17px; line-height: 23.09375px; margin: 10px 0px; padding: 10px 50px; position: relative;">
<pre style="white-space: pre-wrap; width: 645px; word-wrap: break-word;"><code class="xml" style="color: black; display: block; font-family: Coda, cursive; padding: 0.5em;"><script type="text/javascript">

</script></code></pre>
</blockquote>
<center style="color: #333333; font-family: 'Open Sans', 'Trebuchet MS', Helvetica, sans-serif; font-size: 15px; line-height: 23.09375px;">
Hasilnya :  
<div style="background-color: #fbfbfb; border: 5px solid rgb(255, 255, 255); box-shadow: rgb(204, 204, 204) 1px 1px 5px; font-weight: bold; padding: 5px; width: 525px;">
<script type="text/javascript">

</script></div>
</center>
 Dengan Format AM/PM :  
<blockquote style="background-color: #f0f0f0; border-color: rgb(204, 204, 204) rgb(204, 204, 204) rgb(204, 204, 204) rgb(51, 51, 51); border-style: solid; border-width: 1px 1px 1px 4px; color: #111111; font-family: Coda, cursive; font-size: 17px; line-height: 23.09375px; margin: 10px 0px; padding: 10px 50px; position: relative;">
<pre style="white-space: pre-wrap; width: 645px; word-wrap: break-word;"><code class="xml" style="color: black; display: block; font-family: Coda, cursive; padding: 0.5em;">
<script type="text/javascript">
<!--
var a_p = "";
var d = new Date();
var curr_hour = d.getHours();
if (curr_hour < 12) {
 a_p = "AM";
} else {
 a_p = "PM";
}
if (curr_hour == 0) {
 curr_hour = 12;
}
if (curr_hour > 12) {
 curr_hour = curr_hour - 12;
}

function checkTime(i) {
 if (i < 10) {
 i = "0" + i;
 }
 return i;
}
setInterval(showTime, 500);
//-->
</script></div>
</div>
</center>
 
Silahkan berikan komentar jika ada pertanyaan :)</div>

Cara Membuat Jam, Hari dan Tanggal dengan Javascript di Blog

Cara Membuat/Menampilkan Jam, Hari & Tanggal dengan Javascript - Jam, Hari dan Tanggal (Waktu) tidak lepas dari kehidupan, Pada kesempatan kali ini s…

Jul 11, 2015 +

Penjelasan Margin, Padding, Border dalam CSS

<div dir="ltr" style="text-align: left;" trbidi="on">
 
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiEyW-2vM9cOGW8iw5BBbraWXQAHNQozJJ_sFG6BIVULSy5MmdYaPgcLHMc3x_Rciwsjtas0dPejugIIYTGzhcL7dEXpps43MAZiPtlIGviVDv07tfO9nJK5Kfy7Iz1NpOP8cx4YFURyM/s1600/css-web-design.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Penjelasan Margin, Padding, Border dalam CSS " border="0" height="336" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiEyW-2vM9cOGW8iw5BBbraWXQAHNQozJJ_sFG6BIVULSy5MmdYaPgcLHMc3x_Rciwsjtas0dPejugIIYTGzhcL7dEXpps43MAZiPtlIGviVDv07tfO9nJK5Kfy7Iz1NpOP8cx4YFURyM/s640/css-web-design.jpg" title="css" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h1 class="post-title entry-title">
Penjelasan Margin, Padding, Border dalam CSS
</h1>
</td></tr>
</tbody></table>
 
Topik kali ini mengenai CSS "Pengertian Margin, Padding, dan Border".
 tentu bagi CSS developer yang sudah berpengalaman ini topik yang sangat
 sederhana. Tapi saya pikir juga tidak ada salahnya sharing topik CSS basic
 ini, arti dan penyajian elemen dengan menggunakan kode CSS untuk 
margin, padding serta border property.
 
<div style="text-align: justify;">
</div>
<div style="text-align: justify;">
 
Dengan memahami margin, padding, border dan cara menerapkan 
dengan CSS, akan memberi kesempatan bagi pemula, untuk 
bereksperimen sendiri dengan menentukan dan mengatur sifat dan nilai 
property. Ini sering dijumpai pada penerapan css style pada template, 
.body {..},.sidebar {...},. container {...}, css widget, pengaturan 
posisi dan jarak (space) antara sidebar, penerapan pada pargaraf 
posting, pada h1, h2.....dst.</div>
<h4>
Apa Margin itu?</h4>
<div style="text-align: justify;">
Margin (dalam pengertian CSS) adalah ruang disekitar 
elemen/konten. Margin akan membentuk daerah (ruang) vertikal dan 
horizontal antara elemen. Jika elemen/konten tidak memilki margin, maka 
elemen-elemen tersebut akan rapat bertemu terhadap satu sama lain. Agar 
margin bekerja dengan baik, elemen biasanya diikuti oleh posisi float 
atau diposisikan relative. Style ini sering diterapkan untuk dapat 
memindahkan elemen lain di sekitarnya.</div>
<div style="text-align: justify;">
Secara visual akan lebih mudah memahami definisi dari margin ini :</div>
<div style="text-align: justify;">
</div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3fhHNcReaD__uRMcidsmPpUO78MuLGpPOIv6EcIRwXHKXWw-eF9Ow_Z7hhqHh6VrxVYtYtBQ62Y8hQ_exrleQM8cjs8423xFQdPOj0NpY8zq3JCUj1CzsDHXQzMFfEwR0rjHMUHOrIVje/s1600/padding-margin.png" style="margin-left: auto; margin-right: auto;"><img border="0" height="604" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3fhHNcReaD__uRMcidsmPpUO78MuLGpPOIv6EcIRwXHKXWw-eF9Ow_Z7hhqHh6VrxVYtYtBQ62Y8hQ_exrleQM8cjs8423xFQdPOj0NpY8zq3JCUj1CzsDHXQzMFfEwR0rjHMUHOrIVje/s640/padding-margin.png" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">visualisasi pengertian margin</td></tr>
</tbody></table>
<div style="text-align: justify;">
</div>
Margin dapat diatur menggunakan properti margin "shorthand" (yaitu 
istilah, yang mewakili empat nilai marjin untuk elemen) atau dengan 
penulisan stye "longhand". Untuk itu dibawah saya beri contoh beberapa 
penulisan margin dalam css. 
 
Contoh penulisan margin pada suatu elemen ("shorthand") 
 
<pre>#element { margin: 10px;}</pre>
 
Ini berarti elemen memilki margin yang sama "10px" untuk setiap sisi elemen 
 
<pre>#element { margin: 10px 20px; }</pre>
 
Ini berarti elemen memiliki: 
-margin-top, margin-bottom : "10px" 
-margin-left, margin-right : "20px" 
 
<pre>#element { margin: 10px 20px 5px 15px; }</pre>
 
Elemen ini memiliki -margin-top : 10px, margin-right: 20px,  margin-bottom : 5px, margin-left: 15px 
 
Berikut penulisan margin style "longhand": 
<pre>#element { margin-top: 10px; margin-right: 5px; margin-bottom: 5px; margin-left: 10px;}</pre>
 
<h4>
Apa Padding itu?</h4>
<div style="text-align: justify;">
Jadi bagaimana dengan padding? Nah, padding adalah ruang 
horizontal dan vertikal yang diatur di sekitar area isi/konten dari 
elemen yang ditargetkan. Jadi padding di bagian dalam kotak, bukan di 
luar.</div>
<div style="text-align: justify;">
</div>
<div style="text-align: justify;">
Padding juga dapat dipahami sebagai "filling". Karena  padding tidak 
mempengaruhi jarak dari elemen ke elemen lainnya tetapi hanya 
mendefinisikan jarak inner antara tepi/border dan isi dari elemen. 
(lihat visual dibawah)</div>
<div style="text-align: justify;">
</div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzJR3GCiTnsEhPGUqFhXSAKTLBlEm3JYM41WXW39nG6cjNqNAcyJ94d5vDTIfuX46vOPAHE32QjudmAha7_hURI6C3gb7vv7v9nQ8vwJoDS6omZUGLYk51egE2TacP2kPbau9HJTXBjEMS/s1600/padding.png" style="margin-left: auto; margin-right: auto;"><img border="0" height="600" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzJR3GCiTnsEhPGUqFhXSAKTLBlEm3JYM41WXW39nG6cjNqNAcyJ94d5vDTIfuX46vOPAHE32QjudmAha7_hURI6C3gb7vv7v9nQ8vwJoDS6omZUGLYk51egE2TacP2kPbau9HJTXBjEMS/s640/padding.png" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">visual definisi padding</td></tr>
</tbody></table>
<div style="text-align: justify;">
</div>
<div style="text-align: justify;">
<div style="text-align: justify;">
Dari gambar diatas dapat diartikan padding adalah ruang yang diatur 
antara border/tepi dengan isi / konten dari suatu elemen (dalam hal ini 
isi konten berupa text).</div>
<div style="text-align: justify;">
Serupa dengan margin, padding juga diatur menggunakan properti 
padding "shorthand"  dan juga dapat dilakukan dengan properti 
padding "longhand": padding-top, padding-right, padding-bottom, dan padding-left.</div>
 
Contoh :
 
<pre>#element { padding: 10px; }/*padding untuk semua sisi sama 10px*/
#element { padding: 5px 10px 2px 4px; }/*padding: Top, Right, Bottom, Left*/ </pre>
 
<pre>#element { padding-top: 10px; padding-right: 5px; padding-bottom: 5px; padding-left: 10px;} </pre>
 
 
<div style="text-align: justify;">
Pengertian dari properti padding sama dengan  margin, cuma kalau padding bersifat inside
 space dari suatu elemen yang diatur disekitar area konten. Penerapannya
 padding sering dijumpai  hampir disemua elemen, sebagai contoh 
pengggunaan padding pada heading (h1, h2, h3....) di postingan.</div>
 
Contoh :
 
<pre>h1 { background: yellow;
padding: 20px 20px 20px 80px;}

h2 { background: orange;
padding-left:120px;}</pre>
 
Hasilnya pada postingan Anda akan seperti ini : 
 
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJziYjGNGWs4ZDFrSv7oeyTDFFLqk8je_PN8H8tkv-lROPG6XDAG5MuWSwBUAuCMADr4pF8hUdbIUCqj8xeVX19LjUSpzDxhqU6tspcktXoJoI0oWrRZ1kHUH1iCW6i4XYKWLq8XA1WU1H/s1600/new-2.gif" style="margin-left: 1em; margin-right: 1em;"><img alt="heading dan padding" border="0" height="235" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJziYjGNGWs4ZDFrSv7oeyTDFFLqk8je_PN8H8tkv-lROPG6XDAG5MuWSwBUAuCMADr4pF8hUdbIUCqj8xeVX19LjUSpzDxhqU6tspcktXoJoI0oWrRZ1kHUH1iCW6i4XYKWLq8XA1WU1H/s640/new-2.gif" title="heading dan padding" width="640" /></a></div>
<h4>
Apa arti Border?</h4>
Border/garis tepi dapat digunakan untuk banyak hal, misalnya 
sebagai elemen dekoratif atau untuk memberi garis batas pemisah dari dua
 hal. Border properti mendefinisikan width, color, and style dari batas
 area pada box/kotak. 
 
CSS memberi Anda pilihan dalam menggunakan border antara lain : 
<ul>
<li>border-style</li>
<li>border-width</li>
<li>border-color</li>
<li>border-individual</li>
</ul>
Border Style 
<div style="text-align: justify;">
Properti border-style untuk menentukan bentuk (style) dari tampilan border.</div>
<div style="text-align: justify;">
Tak satu pun dari properti border memiliki efek APAPUN kecuali telah menempatkan properti border-style dahulu!</div>
</div>
<div style="text-align: justify;">
Ada 9 type border-style values yang umum digunakan dalam CSS :</div>
<div style="text-align: justify;">
 
1. None : mendefinisikan tidak ada border 
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjS7zzGflE51M6bHgCbtwGnMNHsciq3utLoF47NNPgtyfiKnqhyYwnlrvJnVcmn2D9yhv3CFnwkgYxis48jq4tYSmyHnBSeyEUJ9Dl-C0BZLIDZR4cY4-RKIxjOcXKg3qF3xVq1uQ_dvr-V/s1600/new-4.gif"><img alt="border style" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjS7zzGflE51M6bHgCbtwGnMNHsciq3utLoF47NNPgtyfiKnqhyYwnlrvJnVcmn2D9yhv3CFnwkgYxis48jq4tYSmyHnBSeyEUJ9Dl-C0BZLIDZR4cY4-RKIxjOcXKg3qF3xVq1uQ_dvr-V/s1600/new-4.gif" title="none" /></a> 
2. Dotted : berarti border berupa dot (titik) 
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYk2yWX5BY-g4QAaGYbMVvqyk0EpI9dKCKJQ72sH82yK52GCQVv2KGatAh6MCrN18PJshSdSS9Kpc1WoqPEbxAXTBJH8RybRbr0HcnYb0kSOuEv5TG6n1kmdp9BsdFanb5j73AlRPGFDa1/s1600/new-5.gif"><img alt="Dotted" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYk2yWX5BY-g4QAaGYbMVvqyk0EpI9dKCKJQ72sH82yK52GCQVv2KGatAh6MCrN18PJshSdSS9Kpc1WoqPEbxAXTBJH8RybRbr0HcnYb0kSOuEv5TG6n1kmdp9BsdFanb5j73AlRPGFDa1/s1600/new-5.gif" title="Dotted" /></a> 
3. Dashed : border berupa dashed (garis putus-putus) 
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9MQ0Uvp9BzEg1Ffja-2gXGMSZBQ_ET4euUnvZNTNMCSeWhR4rTUA6wzDoY9UxTrWjekvHpxldHOY6f_B5jTcqvnekxlX7TDXzmzMZcmp2OWfc2xpUCcLH8Iozamjn7xvk2depOW_fahxQ/s1600/new-3.gif"><img alt="Dashed" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9MQ0Uvp9BzEg1Ffja-2gXGMSZBQ_ET4euUnvZNTNMCSeWhR4rTUA6wzDoY9UxTrWjekvHpxldHOY6f_B5jTcqvnekxlX7TDXzmzMZcmp2OWfc2xpUCcLH8Iozamjn7xvk2depOW_fahxQ/s1600/new-3.gif" title="Dashed" /></a> 
<div>
4. Solid : border yang solid 
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJlvYmfktG9xsg2QVQOpTRpv-67bvloQTQzm4l5YyDnVavDh4l4t6RMYQYDDWCERmO3M_4vSVbgEOqZsESNmsqw47vCIsZu5OetaC3aemMVACyGgS6nZ0XZo4ioUCKZUniUjDkSnaeJJIB/s1600/new-6.gif"><img alt="Solid " border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJlvYmfktG9xsg2QVQOpTRpv-67bvloQTQzm4l5YyDnVavDh4l4t6RMYQYDDWCERmO3M_4vSVbgEOqZsESNmsqw47vCIsZu5OetaC3aemMVACyGgS6nZ0XZo4ioUCKZUniUjDkSnaeJJIB/s1600/new-6.gif" title="Solid " /></a> 
5. Double : mendefinisikan double border. Lebar double border adalah sama dengan nilai border-width 
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCStnSBPeUNVVSuTWG3p3iuXQlUczSyWEKDdOLD7ZlAsTbxdYuuX4jrb2Dzc7XemWJyBKE47nscmjkxKjZh508s8UaYGOgXlAL-k0Df6eeVMViG9qlWKaUpRSglWD31BnOe_-hW5ljZl_h/s1600/new-7.gif"><img alt=" Double" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCStnSBPeUNVVSuTWG3p3iuXQlUczSyWEKDdOLD7ZlAsTbxdYuuX4jrb2Dzc7XemWJyBKE47nscmjkxKjZh508s8UaYGOgXlAL-k0Df6eeVMViG9qlWKaUpRSglWD31BnOe_-hW5ljZl_h/s1600/new-7.gif" title=" Double" /></a> 
6. Groove : mendefinisikan sebuah border groove (beralur) 3D. Efeknya tergantung pada nilai border-color 
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCcWWtkDT8oEuIaYcEY__kFDFoFKzlbTMPGHv1BQi264OGH2w3rvtkKojG5Syn4_4I0UWcW9yz7DPkHKI9Yh0ryDIVUrtXEAzho2TqBoMpv5mnar7NRS7Xu_eYjPygqYEadlPEzKL7Ruq9/s1600/new-8.gif"><img alt="Groove" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCcWWtkDT8oEuIaYcEY__kFDFoFKzlbTMPGHv1BQi264OGH2w3rvtkKojG5Syn4_4I0UWcW9yz7DPkHKI9Yh0ryDIVUrtXEAzho2TqBoMpv5mnar7NRS7Xu_eYjPygqYEadlPEzKL7Ruq9/s1600/new-8.gif" title="Groove" /></a> 
7. Ridge: mendefinisikan sebuah border bergerigi (ridge) 3D. Efeknya tergantung pada nilai border-color 
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVcldsDC4X7Oa6hQ8dswOGl6DskankeTZX-n8iL0UOEWYrpesb5vxIwkw7yUTZQaJl5OkkV52JrujLNsSpubj8NUq4yddKFbvyXUx6a6o3wV-R-WVO4yWv_MWa8UeFLzjP7LMvSNGTkPl2/s1600/new-9.gif"><img alt=" Ridge" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVcldsDC4X7Oa6hQ8dswOGl6DskankeTZX-n8iL0UOEWYrpesb5vxIwkw7yUTZQaJl5OkkV52JrujLNsSpubj8NUq4yddKFbvyXUx6a6o3wV-R-WVO4yWv_MWa8UeFLzjP7LMvSNGTkPl2/s1600/new-9.gif" title=" Ridge" /></a> 
8. Inset: mendefinisikan sebuah border inset 3D. Efeknya tergantung pada nilai border-color 
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkyShLRdSrVAlY7rd1YSQ2Z2DYugPF16MdFamTiWB-Qq2e9YW2Mm4vqQpw3O8Ndwv_49jyYXwBCxyOCoBFYwmzaaWmOvvYBpdtTgj26fyJC2bJzXKbQMT27ou7XV_2ww3RsfCgjV5dNtPj/s1600/new-10.gif"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkyShLRdSrVAlY7rd1YSQ2Z2DYugPF16MdFamTiWB-Qq2e9YW2Mm4vqQpw3O8Ndwv_49jyYXwBCxyOCoBFYwmzaaWmOvvYBpdtTgj26fyJC2bJzXKbQMT27ou7XV_2ww3RsfCgjV5dNtPj/s1600/new-10.gif" /></a></div>
9. Outset : mendefinisikan sebuah border outset 3D. Efeknya tergantung pada nilai border-color 
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgI2Fj1HqWS_4fDTeSdbaFiWy2UVxjKkoyzRnxiyiO-ViSlIpUsEGIHEW5Fn2M9fZQopPZ6L8kgCWaQRhnD1K1xOjWsWGPnVvB9szZcVemal5qZ42SWMLhUoaTJPW6XYaU6udCkZa9KpAn4/s1600/new-11.gif"><img alt="Outset" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgI2Fj1HqWS_4fDTeSdbaFiWy2UVxjKkoyzRnxiyiO-ViSlIpUsEGIHEW5Fn2M9fZQopPZ6L8kgCWaQRhnD1K1xOjWsWGPnVvB9szZcVemal5qZ42SWMLhUoaTJPW6XYaU6udCkZa9KpAn4/s1600/new-11.gif" title="Outset" /></a> 
 
Border Width 
<div class="separator" style="clear: both; text-align: center;">
</div>
<div style="text-align: justify;">
Properti border-width digunakan untuk mengatur lebar border/garis tepi.

Border diatur dalam pixel, atau dengan menggunakan salah satu dari tiga nilai yang telah ditentukan : thin, medium, dan thick.
</div>
 
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgv36akTE3QH2NHLKNm9lPeOYuE7UZD6kw3z4d81Ed-PU65-lKbbEg21zddIsCO9y3ZzLFjKsyv_p7NKVuWVUzjwkknHQs83tkZEm035hDdxUj8B5INkxN4mv3caVaIqy9yozIeUqkOATTg/s1600/figure012+%25281%2529.gif" style="margin-left: auto; margin-right: auto;"><img alt="Border Width" border="0" height="193" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgv36akTE3QH2NHLKNm9lPeOYuE7UZD6kw3z4d81Ed-PU65-lKbbEg21zddIsCO9y3ZzLFjKsyv_p7NKVuWVUzjwkknHQs83tkZEm035hDdxUj8B5INkxN4mv3caVaIqy9yozIeUqkOATTg/s640/figure012+%25281%2529.gif" title="Border Width" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">ukuran border dalam pixel dan value thin, medium, thick</td></tr>
</tbody></table>
 
Contoh :
 
 
<div class="pone">
p{
border-style:solid;
border-width:5px;
}</div>
 
<div class="ptwo">
p{
border-style:solid;
border-width:medium;
}</div>
 
<div class="pthree">
p{
border-style:solid;
border-width:1px;
}</div>
 
Border Color 
Properti border-color mendefinisikan warna yang dimiliki oleh border. 
Nilai-nilai yang normal penggunaan nilai warna misalnya: hex "# 123456",
 rgb "(123.123.123)" atau "blue". Anda juga dapat mengatur warna border 
menjadi "transparent". 
 
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJCTc5o289B0bERSkPkfIk8my0URbVFQhZ5YzJQR0VPK-TP4_BQ-6Ye-AmOFU1E_FuljP6qgDtGjcsjOwYOLLjHEF8xAjbArru5CQjaRNVFx3UxS05TPsvMZb_euJodD66mItN2nVfy5en/s1600/figure013.gif" style="margin-left: auto; margin-right: auto;"><img alt="color chart" border="0" height="14" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJCTc5o289B0bERSkPkfIk8my0URbVFQhZ5YzJQR0VPK-TP4_BQ-6Ye-AmOFU1E_FuljP6qgDtGjcsjOwYOLLjHEF8xAjbArru5CQjaRNVFx3UxS05TPsvMZb_euJodD66mItN2nVfy5en/s400/figure013.gif" title="color chart" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><a href="http://problogiz.blogspot.com/2012/09/kode-warna-html.html" target="_blank">chart warna hex</a></td></tr>
</tbody></table>
Contoh : 
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCPwbg35HfwUHasOky1BdX48ekUuUbFAvSAaa4jC5oy3oCsWYGxItsGhgTQMQik56AWkLIes6w4yfr51rk1mRnnO6pIqt7UWn-O1cu9PaUhYfNssU05qXAiypLinHMLndoQpVcafElxXc6/s1600/gbr1.gif" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img alt="Border Color " border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCPwbg35HfwUHasOky1BdX48ekUuUbFAvSAaa4jC5oy3oCsWYGxItsGhgTQMQik56AWkLIes6w4yfr51rk1mRnnO6pIqt7UWn-O1cu9PaUhYfNssU05qXAiypLinHMLndoQpVcafElxXc6/s1600/gbr1.gif" title="Border Color " /></a></div>
 
 
 
 
 
<div>
</div>
Border - Individual sides 
Dalam CSS Anda bisa juga menentukan border yang berbeda pada tiap sisi: 
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh22r3CgRWl77qsiN1y3K1qqPvf-RWbt8YaHCnJnlHOhy0Z_CMcdZhytJ9IS5Jdm1dlPRaf1fXhdDupoNAU-NVl9TKtTkbOjxBY4lC9MrECPdyJBdMSQj9b6powKvJ5BzMEiCTtU6l2SRLx/s1600/new-12.gif" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img alt="Border - Individual" border="0" height="41" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh22r3CgRWl77qsiN1y3K1qqPvf-RWbt8YaHCnJnlHOhy0Z_CMcdZhytJ9IS5Jdm1dlPRaf1fXhdDupoNAU-NVl9TKtTkbOjxBY4lC9MrECPdyJBdMSQj9b6powKvJ5BzMEiCTtU6l2SRLx/s640/new-12.gif" title="Border - Individual" width="640" /></a></div>
 
 
 
 
Nah, gabungan dari pengaturan margin, padding dan border pada sebuah elemen dalam CSS sering disebut juga dengan "box model". 
Diagram di bawah ini menunjukkan bagaimana box model dibangun: 
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUJejv8bfeYiAa2lgKASNcsgTVLsX94ICCu0_bUKG4m5RYGfXHHbwlLYWpWsUjgCoKg_MpQTzVumImCAIAbFyX6lmImV4CRVjbwo6MCW40b9HIQpsnJIP4BiYT5fjlOrZYsCSeOvpi03at/s1600/css-box-model.gif" style="margin-left: auto; margin-right: auto;"><img alt="diagram model box" border="0" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUJejv8bfeYiAa2lgKASNcsgTVLsX94ICCu0_bUKG4m5RYGfXHHbwlLYWpWsUjgCoKg_MpQTzVumImCAIAbFyX6lmImV4CRVjbwo6MCW40b9HIQpsnJIP4BiYT5fjlOrZYsCSeOvpi03at/s640/css-box-model.gif" title="diagram model box" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">diagram model box</td></tr>
</tbody></table>
</div>
<div style="text-align: justify;">
Demikian penjelasan mengenai margin, padding dan border... mudah-mudahan dapat membantu buat para pemula.</div>
<div style="text-align: justify;">
 </div>
<div style="text-align: justify;">
Sumber : <a href="http://problogiz.blogspot.com/2012/12/pengertian-margin-padding-dan-border.html" target="_blank">problogiz</a> </div>
</div>

Penjelasan Margin, Padding, Border dalam CSS Topik kali ini mengenai CSS "Pengertian Margin, Padding, dan Border". tentu bagi CSS developer yang sud…

Jul 10, 2015 +

Website Toko Online 'Vmart'

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
</div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9CVT3hTXNax81ja-2OXTHIVRtiGXsKCjM2mMcE_VWtzvMBl0rVmrZwg33IMnb5sEQLnFCkNdUgr99yP88NjkV1BvkG37zxRnYoWK4IwnPXpl1xUSue-efPF_VWSHPetRjbadGgT1dZpU/s1600/vMart.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Download Script Website Toko Online" border="0" height="296" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9CVT3hTXNax81ja-2OXTHIVRtiGXsKCjM2mMcE_VWtzvMBl0rVmrZwg33IMnb5sEQLnFCkNdUgr99yP88NjkV1BvkG37zxRnYoWK4IwnPXpl1xUSue-efPF_VWSHPetRjbadGgT1dZpU/s1600/vMart.png" title="Vmart" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Download Script Website Toko Online Vmart</td></tr>
</tbody></table>
 
 
<div style="text-align: center;">
<a class="kr_button large rounded" href="http://vmart.masholeh.web.id/" target="_blank"> Demo</a></div>
 Vmart adalah nama dari sebuah website toko online, vmart ini dibuat oleh teman saya Koslab Development (credit by Luqman Hakim), latar belakang terbentuknya vmart ini ialah dari sebuah tugas akhir semester dikala kami menempuh pendidikan SMK di Solo, disaat teman saya membuat website toko online, saya berkepikiran untuk membuat website rumah sakit (Website Rumah Sakit Islam Klaten).  
 
 
 
baca: <a href="http://blog.masholeh.web.id/2014/06/download-script-website-rumah-sakit-islam-klaten.html">http://blog.masholeh.web.id/2014/06/download-script-website-rumah-sakit-islam-klaten.html</a> 
 
 
 
Vmart ini sudah dikatakan layak jual, karena menyandang gelar 'website terbaik dibandingkan dengan 72 siswa yang mengumpulkan tugas akhir semester'. dilengkapi dengan alur penjualan serta pembayaran yang sistematis, dikelola dengan CMS (Control Management System) yang canggih, mempunyai desain website yang dinamis, memiliki database yang kompleks, serta scurity / kemanan website yang diatas rata-rata. 
 
 
 
Maka dari itu saya ingin membagikan hasil karya ini kepada publik dengan sedikit apresiasi 
 
 
 
 
<div style="text-align: center;">
<a class="kr_button large rounded" href="http://masholeh.web.id/blog/download/vmart.zip" target="_blank">Download</a></div>
</div>

Download Script Website Toko Online Vmart Demo Vmart adalah nama dari sebuah website toko online, vmart ini dibuat oleh teman saya Koslab Developme…

Apr 22, 2015 +

Mengenal Berbagai Function PHP String dan Cara Penggunaannya

<div dir="ltr" style="text-align: left;" trbidi="on">
<h3 class="post-title entry-title" style="background-color: white; color: #222222; font-family: Georgia,Times,serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px; text-align: center;">
OPERASI STRING PHP</h3>
<h3 class="post-title entry-title" style="background-color: white; color: #222222; font-family: Georgia,Times,serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px; text-align: center;">
 </h3>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQErAyiG1HMWqLykkeW57vsqEMfCd6fnB8JGS_GKoHVnohRWIghH26zUQhXJRifFjngVcK9WAlXX3eeY-M-nXdsPsWlDeFQcRhasDpi-sZOqCPLVFWwHne1V59hyphenhyphen9xrlL26fXxxXtylTk/s1600/index.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Mengenal Berbagai Function PHP String dan Cara Penggunaannya" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQErAyiG1HMWqLykkeW57vsqEMfCd6fnB8JGS_GKoHVnohRWIghH26zUQhXJRifFjngVcK9WAlXX3eeY-M-nXdsPsWlDeFQcRhasDpi-sZOqCPLVFWwHne1V59hyphenhyphen9xrlL26fXxxXtylTk/s1600/index.jpg" title="Function PHP" width="320" /></a></div>
<h3 class="post-title entry-title" style="background-color: white; color: #222222; font-family: Georgia,Times,serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px; text-align: center;">
 </h3>
<div class="post-header" style="background-color: white; color: #444444; font-family: Georgia, serif; font-size: 12px;">
<div class="post-header-line-1" style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; margin-bottom: 15px;">
<div style="color: #888888; font-style: italic; margin: 5px;">
</div>
<div style="clear: both;">
</div>
</div>
</div>
<div id="tutorial">
Pada tutorial kali ini saya akan menyajikan bentuk-bentuk function 
buil-in didalam PHP yang digunakan untuk mengelola Dan Pengolahan String
 atau disebut juga dengan Operasi String Slamat untuk Membaca....! 
he.... 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Menghitung Jumlah Karakter</h3>
<h4>
strlen()</h4>
Untuk menghitung jumlah karakter dalam suatu variabel string, dapat menggunakan strlen() 
Syntax:  
<pre class="script">strlen($string); 
</pre>
Biasanya fungsi ini digunakan untuk membatasi/filter terhadap jumlah character string yang didinputkan yang pada textbox . 
Contoh 
<pre class="script"><?
$data="Belajar Program PHP tidak sulit."; 
$jumlah=strlen($data); 
echo"variabel string\$data=$data
"; 
echo"Data'$data'diatas jumlah karakternya adalah = $jumlah"; 
?>
</pre>
hasil program, apabila dijalankan pada browser, akan tampak seperti berikut :  
variabel string$data=Belajar Program PHP tidak sulit. 
Data'Belajar Program PHP tidak sulit.'diatas jumlah karakternya adalah = 32 
 
<h4>
strpos()</h4>
Syntax:  
<pre class="script">strpos('[var||string]','[value]' )
</pre>
Function strpos() digunakan untuk menentukan posisi suatu substring dari
 sederetan string. Function ini akan mereturn bilangan integer yang 
merupakan urutan posisi substring tersebut. 
Contoh 
<pre class="script"><?
$stringku = "1234567890";
$posisi = strpos($stringku, "5");
echo "Posisi dari karakter 5 dalam string adalah $posisi";
?>
</pre>
Script di atas akan menghasilkan posisi karakter '5' adalah di 4. 
NB: 
Ingat bahwa index dari array dalam PHP dimulai dari index ke - 0. 
Kelemahan dari strpos() adalah bahwa function tersebut hanya dapat 
menentukan posisi suatu substring pada pemunculan pertama. Pada 
pemunculan substring pada posisi yang berikutnya tidak akan terdeteksi. 
Meskipun demikian, Anda masih tetap menggunakannya untuk mencari posisi 
yang lain dari suatu substring dengan sedikit melakukan pemrograman. 
 
Contoh 
<pre class="script"><?
$stringku = "1234567890123456789012345678901234567890";
$offset = 0;
$counter = 1;
while($offset = strpos($stringku, "5", $offset + 1))
{
$counter++;
echo "
Karakter 5 ke-$counter ada posisi - $offset";
}
?>
</pre>
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Mengulang Penulisan String</h3>
<h4>
str_repeat()</h4>
Gunakan fungsi Str_repeat() apabila suatu program membutuhkan 
pengulangan proses pencetakan dengan jumlah tertentu. Hasil fungsi 
tersebut berupa string yang diulang - ulang sesuai dengan isi teks pada 
argument string. 
Syntax:  
<pre class="script">strpos('[var||string]','[value]' )
</pre>
Contoh 
<pre class="script"><?
//pengulangan data string 
//str_repeat.php 
$ulang=str_repeat("selamat ",4); 
$ulang2=str_repeat("Horee! ",4); 
echo"Anda telah lulus Ujian!
"; 
echo"$ulang
"; 
echo"Welcome to the Holiday
"; 
echo"$ulang2"; 
?>
</pre>
Hasilnya adalah: 
Anda telah lulus Ujian! 
selamat selamat selamat selamat 
Welcome to the Holiday 
Horee! Horee! Horee! Horee! 
 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Mencari dan Mengganti String.</h3>
<h4>
1. ereg_replace()</h4>
<h4>
2. eregi_replace()</h4>
<h4>
3. str_replace()</h4>
Adapun beberapa fungsi yang dapat digunakan untuk mencari dan mengganti bagian string tertentu adalah fungsi Ereg_replace(), Eregi_replace(), dan Str_replace().
 Ketiga fungsi tersebut mempunyai kegunaan yang sama, yaitu mencari pola
 tertentu pada sebuah data string dan menggantinya dengan string yang 
baru 
<h4>
1. ereg_replace()</h4>
Syntax:  
<pre class="script">ereg_replace(pola awal,pola pengganti,string);
</pre>
<h4>
2. eregi_replace()</h4>
Syntax:  
<pre class="script">eregi_replace(pola awal,pola pengganti,string);
</pre>
<h4>
3. str_replace()</h4>
Syntax:  
<pre class="script">Str_replace('[string_replace]','[string_ubah]','[string_asli]' )
</pre>
Function ini memiliki peran yang sama seperti ketika kita menggunakan 
fasilitas Replace All pada MS. Word. Function ini akan menggantikan 
suatu string dengan string yang lain. 
Contoh 
<pre class="script"><?
//replace.php 
//mengganti sebagian dari sebuah string. 
$data="Reog adalah salah satu kesenian tari budaya daerah yang berasal 
 dari kota ponorogo. Reog digambarkan dengan sebuah 
 harimau jawa dan seekor burung merak yang ada diatasnya.";
$str="kesenian"; 
$str2=str_replace($str,"$str",$data); 
echo"Diganti menggunakan fungsi str_replace()."; 
echo" $str2 "; 
$ereg="ponorogo"; 
$ereg2=ereg_replace($ereg,"$ereg",$data); 
echo"Diganti menggunakan fungsi ereg_replace()."; 
echo" $ereg2 "; 
$eregi="seekor"; 
$eregi2=eregi_replace($eregi,"$eregi",$data); 
echo"Diganti menggunakan fungsi eregi_replace()."; 
echo" $eregi2 "; 
 
?>
</pre>
Hasilnya adalah: 
Diganti menggunakan fungsi str_replace(). 
Reog adalah salah satu kesenian tari budaya daerah yang berasal dari 
kota ponorogo. Reog digambarkan dengan sebuah harimau jawa dan seekor 
burung merak yang ada diatasnya. 
Diganti menggunakan fungsi ereg_replace(). 
Reog adalah salah satu kesenian tari budaya daerah yang berasal dari 
kota ponorogo. Reog digambarkan dengan sebuah harimau jawa dan seekor 
burung merak yang ada diatasnya. 
Diganti menggunakan fungsi eregi_replace(). 
Reog adalah salah satu kesenian tari budaya daerah yang berasal dari 
kota ponorogo. Reog digambarkan dengan sebuah harimau jawa dan seekor 
burung merak yang ada diatasnya. 
Contoh 
<pre class="script"><?
$rawstring = "Welcome Birmingham parent! Your offspring 
 is a pleasure to have! We believe pronoun is learning a lot. 
 The faculty simple adores pronoun2 and you can often hear them 
 say \"Attah sex!\" "; 
$replace = array('offspring', 'pronoun2', 'pronoun', 'sex');
 $ubah1 = array('son', 'he', 'him', 'boy'); 
 $ubah2 = array('daughter', 'she', 'her', 'girl'); 
 $malestr = str_replace($replace, $ubah1, $rawstring); 
 $femalestr = str_replace($replace, $ubah2, $rawstring);
 echo "Asli :".$rawstring." "; 
 echo "Son: ". $malestr . " "; 
 echo "Daughter: ". $femalestr; 
 
?>
</pre>
dan tampilannya adalah sbb: 
Asli :Welcome Birmingham parent! 
Your offspring is a pleasure to have! We believe pronoun is learning a lot. 
The faculty simple adores pronoun2 and you can often hear them say "Attah sex!" 
Son: Welcome Birmingham parent! 
Your son is a pleasure to have! We believe him is learning a lot. 
The faculty simple adores he and you can often hear them say "Attah boy!" 
Daughter: Welcome Birmingham parent! 
Your daughter is a pleasure to have! We believe her is learning a lot. 
The faculty simple adores she and you can often hear them say "Attah girl!" 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Fungsi transform string</h3>
<table><tbody>
<tr><th>Function</th><th>Description</th></tr>
<tr><td valign="top">strtoupper()</td><td valign="top">Mengubah string menjadi kapital</td></tr>
<tr><td valign="top">Strtolower()</td><td valign="top">Mengubah string menjadi kecil</td></tr>
<tr><td valign="top">ucfirst()</td><td valign="top">Mengubah awal string menjadi capital</td></tr>
<tr><td valign="top">ucword()</td><td valign="top">Mengubah awal kata dalam string menjadi capital</td></tr>
</tbody></table>
<h4>
1. strtoupper()</h4>
Syntax:  
<pre class="script">strtoupper('[string_convert]' )
</pre>
Function ini digunakan untuk mengubah semua karakter huruf dari suatu string menjadi kapital. 
Contoh 
<pre class="script"><?
$Asli= "Ubah huruf besar 1234";
$upper = strtoupper($Asli);
echo "Old string - $Asli ";
echo "New String - $upper";
?>
</pre>
Hasilnya adalah: 
Old string - String Capitalization 1234 
New String - STRING CAPITALIZATION 1234 
 
<h4>
2. strtolower()</h4>
Syntax:  
<pre class="script">strtolower('[string_convert]' )
</pre>
Kebalikan dari strtoupper(), function ini mengubah semua karakter huruf dari string menjadi huruf kecil. 
Contoh 
<pre class="script"><?
$Asli= "Ubah huruf besar 1234";
$lower = strtolower($Asli);
echo "Old string - $Asli ";
echo "New String - $lower";
?>
</pre>
Hasilnya adalah: 
Old string - String Capitalization 1234 
New String - string capitalization 1234 
<h4>
3. ucfirst()</h4>
Syntax:  
<pre class="script">ucfirst('[string_convert]' )
</pre>
Karakter huruf pertama dalam string juga diubah menjadi huruf capital menggunakan function ini. 
Contoh 
<pre class="script"><?
$string ="berik lagi belajar program php";
echo ucfirst($string);
?>
</pre>
Hasilnya adalah: 
Berik lagi belajar program php4 
<h4>
4. ucwords()</h4>
Syntax:  
<pre class="script">uswords('[string_convert]' )
</pre>
Karakter huruf pertama dari suatu kata dalam string juga dapat diubah menjadi huruf capital menggunakan function ini. 
Contoh 
<pre class="script"><?
$titleString = "a title that could use some hELP";
$ucTitleString = ucwords($titleString);
echo "Old title - $titleString ";
echo "New title - $ucTitleString";
?>
</pre>
Hasilnya adalah: 
Old title - a title that could use some hELP 
New title - A Title That Could Use Some HELP 
Bagaimana cara mengubah HELP menjadi Help (pada tampilan outputnya)? Perhatikan script modifikasi berikut ini 
Contoh 
<pre class="script"><?
$titleString = "a title that could use some hELP";
$lowercaseTitle = strtolower($titleString);
$ucTitleString = ucwords($lowercaseTitle);
echo "Old title - $titleString ";
echo "New title - $ucTitleString";
?>
</pre>
yaitu dengan cara mengubahnya ("hELP") ke huruf kecil semua terlebih 
dahulu ("help"), kemudian huruf pertama dari "help" diberikan perintah 
ucwords(). 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Menghapus Spasi Pada String</h3>
<table><tbody>
<tr><th>Function</th><th>Description</th></tr>
<tr><td valign="top">trim()</td><td valign="top">untuk menghilangkan spasi di bagian kiri dan kanan teks</td></tr>
<tr><td valign="top">rtrim()</td><td valign="top">untuk menghilangkan spasi di bagian kanan teks</td></tr>
<tr><td valign="top">ltrim()</td><td valign="top">untuk menghilangkan spasi di bagian kiri teks</td></tr>
<tr><td valign="top">uchop()</td><td valign="top">untuk menghilangkan spasi di bagian kanan dan juga menghilangkan karakter - karakter whitespace, 
seperti : "\n", "\r", "\t", "\v", "\0"</td></tr>
</tbody></table>
Untuk mengolah data dalam bentuk string, suatu saat ingin mengubah 
posisi spasi pada suatu variabel string. Cara menghapus spasi pada 
sebuah string dapat menggunakan beberapa fungsi sesuai dengan kondisi 
data string. 
Syntax:  
<pre class="script"> trim(string); 
 rtrim(string); 
 ltrim(string); 
 chop(string);

</pre>
Contoh 
<pre class="script"><?
$kata = " Program PHP "; 
echo "Kata '$kata' dengan spasi di depan dan di belakang "; 
$hilang1 = ltrim($kata); 
echo "Di hilangkan spasi di depan menjadi : "; 
echo "'$hilang1' "; 
$hilang2 = rtrim($kata); 
echo "Di hilangkan spasi di belakang menjadi : "; 
echo "'$hilang2' "; 
$hilang3 = trim($kata); 
echo "Di hilangkan spasi di depan dan di belakang menjadi : "; 
echo "'$hilang3' "; 
?>
</pre>
Hasilnya adalah: Kata ' Program PHP ' dengan spasi di depan dan di belakang 
Di hilangkan spasi di depan menjadi : 
'Program PHP ' 
Di hilangkan spasi di belakang menjadi : 
' Program PHP' 
Di hilangkan spasi di depan dan di belakang menjadi : 
'Program PHP' 
 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Pemecah String</h3>
<table><tbody>
<tr><th>Function</th><th>Description</th></tr>
<tr><td valign="top">Strtok()</td><td valign="top">Pemecahan string</td></tr>
<tr><td valign="top">Split()</td><td valign="top">Pemecahan string dilengkapi dengan argumen parameter pembagi.</td></tr>
<tr><td valign="top">Explode()</td><td valign="top">Pemecahan string</td></tr>
<tr><td valign="top">Substr()</td><td valign="top">memecah string berdasarkan no index_awal mulai sampai batasan charakter di inginkan</td></tr>
</tbody></table>
Sebuah string dapat dipecah menjadi beberapa bagian, per kata, dapat menggunakan fungsi Strtok() danSplit() adalah fungsi yang digunakan untuk memecah string, namun fungsi Split() dilengkapi dengan argumen parameter pembagi. Split(Pola,String,Parameter Pembagi); 
<h4>
1. Strtok()</h4>
Syntax:  
<pre class="script">Strtok(nama_string,karakter_pemisah);
</pre>
Contoh 
<pre class="script"><?
$kalimat = "Ibukota Indonesia adalah Jakarta"; 
$pecah = strtok ($kalimat," "); 
while ($pecah) 
{ 
echo " $pecah "; 
$pecah=strtok(" "); 
} 
?>
</pre>
Hasilnya adalah: Penulisan fungsi Strtok() dalam sebuah program adalah : 
Ibukota 
Indonesia 
adalah 
Jakarta 
 
<h4>
2. Split()</h4>
Syntax:  
<pre class="script">Split(Pola,String,Parameter Pembagi); 
</pre>
<h4>
3. explode()</h4>
Syntax:  
<pre class="script">explode('[karakter_explode]','[val||string_awal]')
explode('[karakter_explode]','[val||string_awal]','[value_batasan]')
</pre>
Sesuai namanya "explode", fungsi ini digunakan untuk meledakkan/memecah 
suatu string menjadi potongan-potongan string yang kecil. Selanjutnya 
potongan-potongan string ini akan disimpan dalam suatuarray. Perhatikan contoh berikut ini 
Contoh 
<pre class="script"><?
$PhoneNumber = "800-555-5555";
$hasil = explode("-", $PhoneNumber);
echo " Phone Number = $PhoneNumber ";
echo "Pecahan 1 = $hasil[0] ";
echo "Pecahan 2 = $hasil[1] ";
echo "Pecahan 3 = $hasil[2]";
?>
</pre>
Hasilnya adalah: Phone Number = 800-555-5555 
Pecahan 1 = 800 
Pecahan 2 = 555 
Pecahan 3 = 5555 
 
Contoh 
<pre class="script"><?
$PhoneNumber = "800-555-5555";
$hasil = explode("-", $PhoneNumber);
echo " Phone Number = $PhoneNumber ";
echo "Pecahan 1 = $hasil[0] ";
echo "Pecahan 2 = $hasil[1] ";
echo "Pecahan 3 = $hasil[2]";
?>
</pre>
Pada perintah explode("-", $PhoneNumber); di atas, karakter "-" dapat 
diibaratkan sebagai dinamitnya. Dinamit ini apabila diledakkan akan 
memecah string dari $PhoneNumber.Karakter yang akan digunakan sebagai 
dinamit dapat ditentukan sendiri oleh programmer, dapat berupa spasi, 
koma dsb.Jumlah pecahan string dari hasil ledakan dapat dibatasi dengan 
menambahkan jumlah batasledakan sebagai paramater ketiga dari function 
explode(). 
Perintah explode("-", $PhoneNumber, 2); di atas membatasi 2 buah pecahan string dari hasil ledakan. Dengan demikian, tampak pada hasil bahwa pecahan ketiga tidak ada. 
<h4>
4. substr()</h4>
Syntax:  
<pre class="script">substr('[var||string_awa]','[noindex_start]','[limit_char]')
</pre>
substr adalh fungsi yang dapat memecah string berdasarkan no index_awal mulai sampai batasan charakter di inginkan 
Contoh 
<pre class="script"><?
$tgl="2010-05-12"; 
echo "Tanggal : ".$tgl.""; 
echo "tahun : ".substr($tgl,0,4).""; 
echo "bulan : ".substr($tgl,5,2).""; 
echo "tggl : ".substr($tgl,8,2).""; 
?>
</pre>
Hasilnya adalah: Tanggal : 2010-05-12 
tahun : 2010 
bulan : 05 
tggl : 12 
 
pada contoh diatas dapat dilihat pemecahan suatu string hanya dengan batasan dari parameter fungsisubstr() tujuan dan pengunaanya sama pengunaan fungsi explode() dimana sama-sama memecahkan string.kedua fungsi ini sama tapi berbeda dalam kebutuhan yang efisiensinya masing2. 
Teman saya meminta tolong untuk dibuatkan aplikasi untuk membaca data 
file teks yang dihasilkan dari sebuah mesin presensi bernama AMANO. File
 teks itu berisi data-data presensi karyawan setiap harinya. Mau tahu 
bentuk datanya? Ini saya tampilkan 10 baris contoh datanya ya.... 
<pre>31200801211455000100093408000002
31200801211455000100032510950002
31200801211529000100034212950002
31200801211530000100018412930002
31200801211531000100177001050002
31200801211531000100197108050002
31200801211531000100163007030002
31200801211531000100179402050002
31200801211531000100198408050002

</pre>
Kalau datanya cuman 10 saja seperti di atas sih gak masalah.... Tapi 
kenyataannya satu file teks berisi kira-kira 2000-3000 data presensi. 
Satu file teks dihasilkan dari presensi sehari. Padahal file teks yang 
saya terima berjumlah sekitar 30 buah (presensi dalam 30 hari). Itu pun 
hanya sample file saja yang dikirimkan 
Dari sebuah data yang ada dalam file teks itu bermakna sesuatu. Berikut ini penjelasannya: 
Misalkan diambil data 
31200801211455000100093408000002 
<pre>Penjelasan Digitnya :
Digit 1 - 2 (31) : menunjukkan kode bagian karyawan ditempatkan
Digit 3 - 6 (2008) : menunjukkan tahun ketika presensi
Digit 7 - 8 (01) : menunjukkan bulan ketika presensi
Digit 9 - 10 (21) : menunjukkan tanggal ketika presensi
Digit 11 - 12 (14) : menunjukkan jam ketika presensi
Digit 13 - 14 (55) : menunjukkan menit ketika presensi
Digit 15 - 18 (0001) : menunjukkan keterangan presensi. 
Jika 0001 artinya presensi untuk masuk kerja, dan jika 0002 artinya presensi untuk keluar kerja
Digit 19 - 28 (0009340800) : menunjukkan kode karyawan yang melakukan presensi
Digit 29 - 32 (0002) : menunjukkan kode mesin presensi

</pre>
Nah.... yang jadi permasalahan adalah bagaimana cara mengambil atau 
memisahkan digit-digit tersebut, sehingga dapat dibaca per item data 
seperti penjelasan di atas? 
Dalam PHP, hal ini tidak menjadi masalah karena ada function substr(). Bagaimana sintaksnya? 
<pre class="inden">substr(x, y [, z]);
</pre>
dengan x adalah string utuh yang akan diambil substring nya, y adalah 
posisi awal substring (dimulai dari 0), dan z adalah panjang substring 
yang akan diambil. Parameter z sifatnya optional. Apabila z tidak 
diberikan, maka pengambilan substring mulai dari posisi awal y sampai 
dengan akhir dari string. 
Contoh 
<pre class="script"><?
$stringKu = "hallo";
echo substr($stringKu, 1); // menghasilkan "allo"
echo substr($stringKu, 1, 3); // menghasilkan "all"
echo substr($stringKu, 0, 4); // menghasilkan "hall"

?>
</pre>
Sehingga untuk kasus data presensi di atas, script untuk memisahkan setiap item adalah sebagai berikut: 
Contoh 
<pre class="script"><?
$data = "31200801211455000100093408000002";
$kodeBagian = substr($data, 0, 2);
$tahun = substr($data, 2, 4);
$bulan = substr($data, 6, 2);
$tanggal = substr($data, 8, 2);
$jam = substr($data, 10, 2);
$menit = substr($data, 12, 2);
$keterangan = substr($data, 14, 4);
$kodeKary = substr($data, 18, 10);
$kodePresensi = substr($data, 28, 4);
?>
</pre>
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Mengabungkan string yang terpecah</h3>
<h4>
implode()</h4>
Syntax:  
<pre class="script">explode('[karakter_implode]','[val||string_awal]')
</pre>
Kebalikan dari explode(), function implode() digunakan untuk menyatukan pecahan-pecahan string menjadi satu kesatuan string. 
Contoh 
<pre class="script"><?
$pecahan = array("Hello", "World,", "I", "am", "Here!");
$disatukandenganspasi = implode(" ", $pecahan);
$disatukandengandash = implode("-", $pecahan);
echo "$disatukandenganspasi ";
echo "$disatukandengandash ";
?>
</pre>
Hasilnya adalah: Hello World, I am Here! 
Hello-World,-I-am-Here! 
 
Bagaimana jika pengabungan kerja fungsi explode() dengan implode() 
dimana satu memisahkan dan yang satu mengabungkan adalah seperti contoh 
berikut: 
Contoh 
<pre class="script"><?
$PhoneNumber = "800-555-5555"; 
$hasil = explode("-", $PhoneNumber);
 echo " Phone Number = $PhoneNumber "; 
echo "Pecahan 1 = $hasil[0] "; 
echo "Pecahan 2 = $hasil[1] "; 
echo "Pecahan 3 = $hasil[2] "; 
$join=implode("**",$hasil); 
echo "Join :$gabung"; 
?>
</pre>
Hasilnya adalah: Phone Number = 800-555-5555 
Pecahan 1 = 800 
Pecahan 2 = 555 
Pecahan 3 = 5555 
pengabugana :800**555**5555 
 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Memecah File Ber-extensi</h3>
<h4>
pathinfo()</h4>
Syntax:  
<pre class="script">pathinfo('[file]')
</pre>
fungsi pathfile bekerja untuk memecah file yang berexstensi .dimana pecahan tersebut terbentuk dalam kedalam array assosatif . yaitu pecahan fiename dan pecahan extension 
Contoh 
<pre class="script"><?
$str='text.php';
$ext=pathinfo($str);
echo $ext['filename']." "; 
echo $ext['extension']; 
 
?>
</pre>
Hasilnya adalah: text 
php 
 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Membaca nama file dari suatu path</h3>
<h4>
basename()</h4>
Syntax:  
<pre class="script">basename('path_root_dir')
</pre>
Function ini digunakan untuk membaca nama file dari suatu path. 
Contoh 
<pre class="script"><?
$path = "/home/httpd/html/index.php";
echo basename($path); // menghasilkan 'index.php'
echo basename($path, ".php") ; // menghasilkan 'index' (menghapus ekstensi .php)
?>
</pre>
Contoh lain, bila script di bawah ini disimpan dengan nama myscript.php 
Contoh 
<pre class="script"><?
echo basename($_SERVER['PHP_SELF'], ".php"); // menghasilkan 'myscript' 
?>
</pre>
Hasilnya adalah: menghasilkan 'myscript' 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Character ASCII</h3>
<h4>
chr()</h4>
Syntax:  
<pre class="script">chr('[nomber_karakter_ASCII]')
</pre>
Function chr() digunakan untuk menghasilkan karakter ASCII berdasarkan bilangan bulat ASCII nya. 
Contoh 
<pre class="script"><?
$ascii = chr(97);
echo "Karakter ASCII dari 97 adalah: ".$ascii;
?>
</pre>
Hasilnya adalah: a 
Contoh 
<pre class="script"><?
echo "<table border=1><tr><th colspan=2>Cahracter ASCII</th></tr>
<tr><td>No ASCII</td><td>Character</td></tr>";
for ($n=0;$n<=255:$n++)
{
echo "<tr><td> ASCII : $n </td><td>".chr($n)." </td></tr>";
}
echo "</table>";

?>
</pre>
Hasilnya adalah: Berupa karakter Huruf yang Di konversi ke ASCII dengan bit 127 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
Memformat Angka</h3>
<h4>
number _format()</h4>
Standar penulisan angka ( terutama dalam masalah mata uang ), sangat 
berbeda antara negara kita dengan sistem lain diluar negeri. Untuk 
memisahkan jumlah ribuan, biasanya menggunakan tanda titik, sedangkan 
sistem di luar menggunakan tanda koma. Fungsi number-format dapat 
ddigunakan untuk mengubah tampilan angka dalam laporan. 
Contoh 
<pre class="script"><?
$harga_sepatu = 195450; 
echo($harga_sepatu . "\n"); 
echo("\$" . number_format($harga_sepatu,"2",".","") . "\n"); 
echo" "; 
echo"Harga sepeda motor adalah ".number_format("12156688","2",",",".")."(dalam rupiah)"; 
?>
</pre>
Hasilnya adalah: 
195450 $195450.00 
Harga sepeda motor adalah 12.156.688,00(dalam rupiah) 
 
<h3 style="color: #222222; font-family: Georgia, Times, serif; font-size: 36px; font-weight: normal; line-height: 38px; margin: 0px; padding: 0px;">
memberikan tanda slash " \ "</h3>
<h4>
Addcslashes( )</h4>
<pre>Fungsi Addcslashes( ) digunakan untuk memberikan tanda slash " \ " pada karakter tertentu. 
Bentuk : Addcslashes(String_awal, Parameter_slash); 
Keterangan : 
 String adalah argument yang menunjukkan data awal yang akan diproses. 
 Parameter adalah argument yang menunjukkan parameter filter.

</pre>
Contoh 
<pre class="script"><?
// memberikan tanda slash pada karakter tertentu 
// addcslashes.php 
$data="Membuat web interaktif dengan program PHP."; 
echo"Sebelum ditambahkan \"\\\" : "; 
echo"$data"; 
$slash=Addcslashes($data,'ai); 
echo" Sekarang ditambahkan \"\\\" pada huruf a dan i saja : "; 
echo"$slash";

?>
</pre>
Hasil eksekusi adalah sebagai berikut : 
Sebelum ditambahkan "\" : 
Membuat web interaktif dengan program PHP. 
Sekarang ditambahkan "\" pada huruf a dan i saja : 
Membu\at web \inter\akt\if deng\an progr\am PHP. 
 
Untuk Pemahaman lebih lanjut tentang Operasi String saya akan menyajikan pada tutorial selanjutnya Yang terdapat Pada tap menu Tutorial realease Atas Waktu teman2, yang telah membaca tutorial saya yang sederhana ini saya ucapkan Terimakasih.....!</div>
<div id="tutorial">
 </div>
<div id="tutorial">
Re-post : http://almbantuli.blogspot.com/2013/03/php-fungsi-fungsi-php-khusus-string.html </div>
</div>

Mengenal Berbagai Function PHP String dan Cara Penggunaannya

OPERASI STRING PHP Pada tutorial kali ini saya akan menyajikan bentuk-bentuk function buil-in didalam PHP yang digunakan untuk mengelola Dan Pen…

Feb 22, 2015 +

Cara membuat polling atau voting dengan PHP

<div dir="ltr" style="text-align: left;" trbidi="on"><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6oa2M9cdY-h6mXrCQUnYO5a4KFkFvE6_Yvw7qup04OE94h4SOZa5Ra4EOuNDKHE6qggv0Qlcgt9tIzdrv0OBBFwL-KBRkX0s88Q6P0tqy2mVtEeh3uiLJRXFEN9l9ohMFZtwAwEATdcM/s1600/voting.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Membuat Voting atau Polling dengan PHP" border="0" height="286" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6oa2M9cdY-h6mXrCQUnYO5a4KFkFvE6_Yvw7qup04OE94h4SOZa5Ra4EOuNDKHE6qggv0Qlcgt9tIzdrv0OBBFwL-KBRkX0s88Q6P0tqy2mVtEeh3uiLJRXFEN9l9ohMFZtwAwEATdcM/s1600/voting.png" title="voting" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Membuat Voting atau Polling dengan PHP</td></tr>
</tbody></table> 
 
Kali ini saya bahas tentang Membuat Voting dengan PHP, voting biasanya digunakan oleh admin web dengan menyodorkan sebuah pertanyaan dengan beberapa sebuah pilihan kemudian pengunjung web disuruh memilih mana yang terbaik menurutnya. 
 
 
 
Okee Simak Baik-baik..... 
 
 
 
<div id="tabmenu"><ul id="nar"><li><a class="active" href=#">Database</a></li>
<li><a href="#">Style.css</a></li>
<li><a href="#">Index.php</a></li>
<li><a href="#">voting.php</a></li>
<li><a href="#">View-voting.php</a></li>
<li><a href="#">koneksi.php</a></li>
</ul><div id="tab-konten"><div id="tab1">Buatlah database dengan nama voting, berikut struktur databasenya: 
 
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6CDJPf1IfAjZz0nrVWj3YQ70bdiP3ZQV5Vzck4Q1bk7_3MQFpOvUhlwooDxrAgQy3Phc0BgoVqQxx7mn_Q_ed_C5Rk3BLTpz9kJKRhE3ZbE2Jfto63XDU3fcDdjoHqXhJolKwA0KtbwE/s1600/db.png" /></div><div id="tab2"> 
 
 
 
body { 
 
 margin:0; 
 
 background-color:#fff; 
 
 
 
} 
 
 
 
#sidebar{ 
 
 background-color:#f3f1e7; 
 
 margin-left:30%; 
 
 margin-right:30%; 
 
 margin-top:5%; 
 
 border-radius:5px; 
 
 box-shadow:5px 0px 5px #999; 
 
 border-color:#C4E0AF; 
 
 border-style:solid; 
 
 border-width:thin; 
 
} 
 
 
 
 #sidebar .body { 
 
 margin: 20px 5px 20px 5px; 
 
 } 
 
 
 
 #sidebar .judul { 
 
 margin:-13px auto 0; 
 
 width:98%; 
 
 height:35px; 
 
 background-color:#96b74b; 
 
 background-repeat:repeat-x; 
 
 border-radius:5px; 
 
 } 
 
 
 
 #sidebar .judul h4{ 
 
 color:#ffffff; 
 
 text-shadow:0px 0px 5px #666666; 
 
 padding-left:10px; 
 
 padding-top:5px; 
 
 } 
 
 
 
 #sidebar li{ 
 
 list-style-type:none; 
 
 display:block; 
 
 padding-top:8px; 
 
 padding-bottom:8px; 
 
 margin-left:-40px; 
 
 border-bottom:1px solid; 
 
 border-color:#C4E0AF; 
 
 
 
 } 
 
 
 
 #sidebar li a{ 
 
 color:#2e776a; 
 
 text-decoration:none; 
 
 padding-left:5px; 
 
 } 
 
 
 
 #sidebar li:hover{ 
 
 color:#ffffff; 
 
 background-color:#b2df8e; 
 
 padding-left:-80px; 
 
 } 
 
 </div><div id="tab3"><?php 
 
include "koneksi.php"; 
 
?> 
 
 
 
<!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=utf-8" /> 
 
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0"/> 
 
<title>Demo Voting - Masholeh</title> 
 
<link href="style.css" rel="stylesheet" type="text/css" /> 
 
<script type="text/javascript"> 
 
function voting(){ 
 
 
 
 alert('Terima Kasih Anda telah mengikuti Voting'); 
 
 return false; 
 
 
 
} 
 
</script> 
 
 
 
</head> 
 
 
 
<body> 
 
<div id="isi"> 
 
 
 
<div id="sidebar"><div class="judul"><h4>Tentukan Pilihan Anda</h4></div> 
 
<div class="body"> 
 
 Apakah Tutorial WWW.BLOG.MASHOLEH.WEB.ID Bermanfaat Bagi Anda? 
 
 <form method="post" action="voting.php"> 
 
 
 
 <table> 
 
 <tr><td width="20"><input type="Radio" name="polling" value="sangat" checked></td> 
 
 <td>Sangat Bermanfaat</td></tr> 
 
 <tr><td width="20"><input type="Radio" name="polling" value="bermanfaat"></td> 
 
 <td>Bermanfaat</td></tr> 
 
 <tr><td width="20"><input type="Radio" name="polling" value="biasa"></td> 
 
 <td>Biasa Saja</td></tr> 
 
 <tr><td width="20"><input type="Radio" name="polling" value="tidak"></td> 
 
 <td>Tidak Bermanfaat</td></tr> 
 
 <tr><td width="20"><input type="Radio" name="polling" value="sangattidak"></td> 
 
 <td>Sangat Tidak Bermanfaat</td></tr> 
 
 <tr><td width="20"></td><td><input type="submit" name="polling2" value="Vote" onClick="voting();"></tr> 
 
 </table> 
 
 
 
 </form> 
 
 
 
</div> 
 
</div> 
 
 
 
 
 
</div> 
 
</body> 
 
</html></div><div id="tab4"><? 
 
if (isset($_POST['polling'])) 
 
{ 
 
 include "koneksi.php"; 
 
 $pilihan=$_POST['polling']; 
 
 $tanggal; 
 
 
 
 $polling=mysql_db_query($db,"select * from voting",$koneksi); 
 
 $baris=mysql_fetch_row($polling); 
 
 list($sangat,$bermanfaat,$biasa,$tidak,$sangattidak)=$baris; 
 
 
 
 $array1=$sangat+1; 
 
 $array2=$bermanfaat+1; 
 
 $array3=$biasa+1; 
 
 $array4=$tidak+1; 
 
 $array5=$sangattidak+1; 
 
 
 
 
 
 switch($pilihan) 
 
 { 
 
 case "sangat"; 
 
 echo " "; 
 
 $update=mysql_db_query($db,"update voting set sangat='$array1', tanggal='$tanggal'",$koneksi); 
 
 echo "<script> document.location.href='view-voting.php'; </script>"; 
 
 break; 
 
 
 
 case "bermanfaat"; 
 
 echo " "; 
 
 $update=mysql_db_query($db,"update voting set bermanfaat='$array2', tanggal='$tanggal'",$koneksi); 
 
 echo "<script> document.location.href='view-voting.php'; </script>"; 
 
 break; 
 
 
 
 case "biasa"; 
 
 echo " "; 
 
 $update=mysql_db_query($db,"update voting set biasa='$array3', tanggal='$tanggal'",$koneksi); 
 
 echo "<script> document.location.href='view-voting.php'; </script>"; 
 
 break; 
 
 
 
 case "tidak"; 
 
 echo " "; 
 
 $update=mysql_db_query($db,"update voting set tidak='$array4', tanggal='$tanggal'",$koneksi); 
 
 echo "<script> document.location.href='view-voting.php'; </script>"; 
 
 break; 
 
 
 
 case "sangattidak"; 
 
 echo " "; 
 
 $update=mysql_db_query($db,"update voting set sangattidak='$array5', tanggal='$tanggal'",$koneksi); 
 
 echo "<script> document.location.href='view-voting.php'; </script>"; 
 
 break; 
 
 
 
 } 
 
 
 
}</div><div id="tab5"><!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=utf-8" /> 
 
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0"/> 
 
<title>Demo Voting - Masholeh</title> 
 
<link href="style.css" rel="stylesheet" type="text/css" /> 
 
</head> 
 
 
 
<body> 
 
 
 
<? 
 
 include "inc/koneksi.php"; 
 
 $hasil=mysql_db_query($db,"select * from voting",$koneksi); 
 
 $row=mysql_fetch_row($hasil); 
 
 list($sangat,$bermanfaat,$biasa,$tidak,$sangattidak,$megah,$masih)=$row; 
 
 $total=(int)$sangat+(int)$bermanfaat+(int)$biasa+(int)$tidak+(int)$sangattidak; 
 
 
 
 //menampilkan persentase 
 
 $persen_sangat =round(((int)$sangat/(int)$total)*100,2); 
 
 $persen_bermanfaat =round(((int)$bermanfaat/(int)$total)*100,2); 
 
 $persen_biasa =round(((int)$biasa/(int)$total)*100,2); 
 
 $persen_tidak =round(((int)$tidak/(int)$total)*100,2); 
 
 $persen_sangattidak =round(((int)$sangattidak/(int)$total)*100,2); 
 
 $persen_megah =round(((int)$megah/(int)$total)*100,2); 
 
 $persen_masih =round(((int)$masih/(int)$total)*100,2); 
 
 
 
 //mengkonversi persentasi menjadi ukuran pada diagram batang dengan mengalikan faktor 2, karena jika 100% artinya lebar maksimum digram adalah 100pt 
 
 $lebar_sangat=$persen_sangat*2; 
 
 $lebar_bermanfaat=$persen_bermanfaat*2; 
 
 $lebar_biasa=$persen_biasa*2; 
 
 $lebar_tidak=$persen_tidak*2; 
 
 $lebar_sangattidak=$persen_sangattidak*2; 
 
 
 
 
 
?> 
 
 
 
<div id="sidebar"><div class="judul"><h4>Hasil Voting</h4></div> 
 
 
 
<center>Apakah Tutorial WWW.BLOG.MASHOLEH.WEB.ID Bermanfaat Bagi Anda?</center> 
 
<table width="100%" border="0" cellspacing="2" cellpadding="2"> 
 
<tr> 
 
 <td><table border="0" width="100%"> 
 
    
 
      <tr> 
 
        <td width="30%" align="left">Sangat Bermanfaat</td> 
 
        <td width="5%" align="right"><? echo $sangat;?></td> 
 
        <td width="1%">&nbsp;</td> 
 
        <td width="20%" align="left"><img src="images/stat.jpg" border="1" width="<? echo $lebar_sangat ?>" height="12"> 
 
 <? echo $persen_sangat."%"; ?></td> 
 
      </tr> 
 
      <tr> 
 
        <td align="left">Bermanfaat</td> 
 
        <td align="right"><? echo $bermanfaat;?></td> 
 
        <td>&nbsp;</td> 
 
        <td align="left"><img src="images/stat.jpg" border="1" width="<? echo $lebar_bermanfaat ?>" height="12"> 
 
 <? echo $persen_bermanfaat."%";?> </td> 
 
      </tr> 
 
      <tr> 
 
        <td align="left">Biasa Saja</td> 
 
        <td align="right"><? echo $biasa;?></td> 
 
        <td>&nbsp;</td> 
 
        <td align="left"><img src="images/stat.jpg" border="1" width="<? echo $lebar_biasa ?>" height="12"> 
 
 <? echo $persen_biasa."%";?></td> 
 
      </tr> 
 
  <tr> 
 
        <td align="left">Tidak Bermanfaat</td> 
 
        <td align="right"><? echo $tidak;?></td> 
 
        <td>&nbsp;</td> 
 
        <td align="left"><img src="images/stat.jpg" border="1" width="<? echo $lebar_tidak ?>" height="12"> 
 
 <? echo $persen_tidak."%"; ?></td> 
 
      </tr> 
 
      <tr> 
 
        <td align="left">Sangat Tidak Bermanfaat</td> 
 
        <td align="right"><? echo $sangattidak;?></td> 
 
        <td>&nbsp;</td> 
 
        <td align="left"><img src="images/stat.jpg" border="1" width="<? echo $lebar_sangattidak ?>" height="12"> 
 
 <? echo $persen_sangattidak."%";?> </td> 
 
      </tr> 
 
    </table> 
 
 </td> 
 
</tr> 
 
<tr> 
 
 <td align="center"><? echo 'Total Voting : ',$total; ?></td> 
 
</tr> 
 
</table> 
 
 
 
<a href="index.php">Back To Home</a> 
 
</div> 
 
 
 
 
</div><div id="tab6"><?php 
 
ini_set('display_errors',FALSE); 
 
 $server="localhost"; 
 
 $user_db="root"; 
 
 $pass_db=""; 
 
 $db="voting"; 
 
 
 
$koneksi=mysql_connect($server,$user_db,$pass_db) or die("Gagal Koneksi DB!"); 
 
mysql_select_db($db) or die ("DB tidak ada!"); 
 
$tanggal=date("Y-m-d"); 
 
 
 
?></div></div></div><div style="text-align: center;">Sekian dari saya, banyak lebihnya Terimakasih !!! 
 
 
</div><div style="text-align: center;"><a class="kr_button rounded" href="http://www.masholeh.web.id/blog/demo/voting" target="_blank"> Demo </a><a class="kr_button rounded" href="http://www.masholeh.web.id/blog/download/voting.zip" target="_blank"> Download</a></div></div>

Membuat Voting atau Polling dengan PHP Kali ini saya bahas tentang Membuat Voting dengan PHP, voting biasanya digunakan oleh admin web dengan menyodo…

Jan 19, 2015 +

Load more posts

M-S Blog

M-S Blog

M-S Blog

Cara Membuat Jam, Hari dan Tanggal dengan Javascript di Blog

Penjelasan Margin, Padding, Border dalam CSS

Website Toko Online 'Vmart'

Mengenal Berbagai Function PHP String dan Cara Penggunaannya

Cara membuat polling atau voting dengan PHP

Popular Posts

Blog Archive