Kamis, 09 Juni 2016

Audio Dan  Video di HTML5

Audio Dan Video di HTML5


Sebuah file audio atau video sebenarnya adalah file kontainer,artinya ada file video dan audio di dalamnya.,mirip dengan arsio .zip .rar yang di dalamnya bisa ada beberapa file.

contohnya sebuah file video,akan mengandung track video ,track audio, dan metadata tambahan.Track audio, dan video ini di kombinasikan saat run time untuk memainkan video plus suaranya,adapun metadata menampilkan informasi seputar video, seperti convert art,title dan subtitle,captioning dan lain sebagainya. berikut beberapa ormat kontainer vidio yang populer antara lain:

  • Audio Video Interleave (.avi)
  • Flash Video (.flv)
  • MPEG 4 (.mp4)
  • Matroska (.mkv)
  • ogg (.ogv)
Codec Audio dan Video,adalah algoritma yang di gunakan untu encoding dan decoding video atau stream video tertentu sehingga bisa di putar.media raw sangat banyak sekali,sehingga tanpa encoding klip video dan audio akan memiliki ukuran yang sangat besar.

tanpa decoder,penerimaan file tidak akan  bisa menyusun kembali sumber media asli dari bentukk yang sudah ter-encoding.codec memungkinkan memahami berbagai format kontainer,dan kemudian mendecode track audio dan video yang di kandungnya.

berikut jenis-jenis codec audio:
  • AAC
  • MPEG-3
  • Ogg Vorbis
Adapun contoh codec Video sebagai berikut:
  • H.264
  • VP8
  • Ogg Theora
Tidak semua web browser memndukung codec di atas.

Baca juga Cara memutar audio dan video dengan HTML5 di web Browser.
Cara membuat penambahan dan pengurangan secara otomatis dengan JQuery |PHP dan HTML

Cara membuat penambahan dan pengurangan secara otomatis dengan JQuery |PHP dan HTML


Cara membuat penambahan dan pengurangan secara otomatis dengan JQuery |PHP dan HTML-ciwer.id kesempatan kali ini saya akn share program sederhana untuk melakukan proses penmbhan dan pengurangan secara otomatis di PHP dan HTML menggunkan jquery.

lasung saja sobat.
berikut ini ini adalah script text javascript

<script language='JavaScript'>
$(document).ready(function(){
    var inpA = "input[rel=Ajumlah]";
    var inpB = "input[rel=Bjumlah]";  
    $(inpA).bind('keyup',function() {
        var avalA=0;
        var bVal = parseInt($('#Btotal').val(),10);
        $(inpA).each(function() {
            if(this.value !='') avalA += parseInt(this.value,10);
        });
        $('#Atotal').val(avalA);
        $('#selisih').val(avalA - bVal);
        console.log('Value avalA: ' + avalA);
    });  
    $(inpB).bind('keyup',function() {
        var avalB=0;
        var aVal = parseInt($('#Atotal').val(),10);
        $(inpB).each(function() {
            if(this.value !='') avalB += parseInt(this.value,10);
        });
        $('#Btotal').val(avalB);
        $('#selisih').val(aVal - avalB);
        console.log('Value avalB: ' + avalB);
    });
});
</script>
script di atas berfungsi untuk melakukan proses hitung penambahan dan pengurangan otomatis.
untuk script lengkpanya bisa lihat di bawah ini.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Koding Sederhana CIWER.ID</title>
<!-- Latest compiled and minified CSS --><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<!-- Optional theme --><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<!-- Latest compiled and minified JavaScript --><script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script language='JavaScript'>
$(document).ready(function(){
    var inpA = "input[rel=Ajumlah]";
    var inpB = "input[rel=Bjumlah]";  
    $(inpA).bind('keyup',function() {
        var avalA=0;
        var bVal = parseInt($('#Btotal').val(),10);
        $(inpA).each(function() {
            if(this.value !='') avalA += parseInt(this.value,10);
        });
        $('#Atotal').val(avalA);
        $('#selisih').val(avalA - bVal);
        console.log('Value avalA: ' + avalA);
    });
      $(inpB).bind('keyup',function() {
        var avalB=0;
        var aVal = parseInt($('#Atotal').val(),10);
        $(inpB).each(function() {
            if(this.value !='') avalB += parseInt(this.value,10);
        });
        $('#Btotal').val(avalB);
        $('#selisih').val(aVal - avalB);
        console.log('Value avalB: ' + avalB);
    });
});
</script>
</head>
<body>
<div class="container">
<div class="jumbotron col-md-8">
<div class="panel panel-primary ">
<div class="panel-heading">
<h3 class="panel-title">
CIWER.ID |Penambahan Dan Pengurangan Otomatis Dengan Jquery</h3>
</div>
<div class="panel-body">
<div class="col-md-4">
<input type="text" class="form-control" name="Ajumlah1" placeholder="masukkan angka" rel="Ajumlah"/><br/>
<input type="text" class="form-control" name="Ajumlah2" placeholder="masukkan angka" rel="Ajumlah"/><br/>
<input type="text" class="form-control" name="Ajumlah3" placeholder="masukkan angka" rel="Ajumlah"/><br/>
<input type="text" class="form-control" name="Ajumlah4" placeholder="masukkan angka" rel="Ajumlah"/><br/>
<input type="text" class="form-control" name="Ajumlah5" placeholder="masukkan angka" rel="Ajumlah"/><br/>
<input type="text" class="form-control" name="Ajumlah6" placeholder="masukkan angka" rel="Ajumlah"/><br/>
Total A: <input type="text" class="form-control" name="Atotal" placeholder="Hasil Dari Penambahan" id="Atotal"/><br/><br/>
</div>
<!-- Dan seterusnya -->
<div class="col-md-4">
<input type="text" class="form-control" placeholder="masukkan angka" name="Bjumlah1" rel="Bjumlah"/><br/>
<input type="text" class="form-control" placeholder="masukkan angka" name="Bjumlah2" rel="Bjumlah"/><br/>
<input type="text" class="form-control" placeholder="masukkan angka" name="Bjumlah3" rel="Bjumlah"/><br/>
<input type="text" class="form-control" placeholder="masukkan angka" name="Bjumlah4" rel="Bjumlah"/><br/><br/>
<!-- Dan seterusnya -->
Total B: <input type="text" class="form-control" name="Btotal" placeholder="Hasil dari Penambahan" id="Btotal"/><br/><br/>
Selisih: <input type="text" class="form-control" name="selisih" placeholder="Hasil dari A-B" id="selisih"/><br/><br/><br/>
</div>
</div>
</body>
</html>

simpan dengan nama index.php atau sesuka anda.,sebelumnya anda menjalan kan program tersebut sobat harus mendownload jquery terlebih dahulu .
Download Jquery.
Setelah di download letakan jquery bersandingan dengan file index.php yang telah di buat.

ok sobat sekian,semoga ini bermanfaat.

Lihat juga ke sini

Rabu, 08 Juni 2016

Source Code HTML Aritmatika.

Source Code HTML Aritmatika.

Source Code HTML Aritmatika Cara Membuat Pembagian PHP dan HTML Berikut ini merupakan koding sederhana,untuk melakun proses perhitungan pembagian di dalam web browser dengan menggunkan PHP dan HTML.yang sobat semua pasti bisa untuk membuatnya.

Persiapan :
Editor notepad++
Web browser Crome or firefox.
pastikan akses localhost sobat sudah aktif.

Pertama buat file index.php dan simpan di folder yang sobat tentukan,
kemudian copy contoh koding berikut yang kemungkinan sobat bisa kembangkan koding nya,



   <!DOCTYPE html>
    <html lang="en">
      <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
        <title>Koding Sederhana CIWER.ID</title>
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <!-- Optional theme -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
    <!-- Latest compiled and minified JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    </head>
    <body>
    <div class="container">
    <div class="jumbotron col-md-4">
    <div class="panel panel-primary ">
    <div class="panel-heading">
    <h3 class="panel-title">
    CIWER.ID</h3>
    </div>
    <div class="panel-body">

    <!--Koding .PHP-->
    <?php
    //definisikan setiap variabel yang digunakan
        $nilai1 = "";
        $nilai2 = "";
        $nilai3 = "";
    if(isset($_POST['text1'])and
            ($_POST['text2'])
            ){
        $nilai1 = $_POST['text1'];    #mengambil nilai didalam
        $nilai2 = $_POST['text2'];    #formulir sesuai name yang ada
        $nilai3 = $nilai1/$nilai2;
    }
    ?>
    <!--end koding .PHP-->
    <form action="index.php" method="post">
        <input type="text" class="form-control" name="text1" value="<?php echo $nilai1?>" placeholder="masukkan angka"><br/>
        <input type="text" class="form-control" name="text2" value="<?php echo $nilai2?>" placeholder="masukkan angka"><br/>
        <input type="submit" class="btn btn-primary" value="Tambah">
     <br/><br/>
        <input type="text" class="form-control" value="<?php echo $nilai3?>"/>
    </form>
    </body>
    </html>


koding di atas,yang pertama kali dilakukan adalah menginisiali variabel yang dibutuhkan, setelah itu, mengambil nilai dari dalam formulir sesuai dengan name masing-masing.

Kemudian pata button form action. Terdapat aksi menuju ke dokumen index.php yang tak lain adalah dokumen untuk file program itu sendiri. Jadi eksekusi program dilaksanakan dengan tujuan formulir . HTML pada dokumen yang sama.

dan koding di atas sudah di lengkpi dengan ccs bootstrap ,yang berfungsi untuk mempercantik tampilan desain contoh program tersebut..


OK sobat sekian semoga artikel ini membantu..
Baca Juga artikel Yang cocok dengan pencarian sobat . Baca disini

Tag : Membuat Calculator PHP Cara membuat pengurangan penambahan PHP dan HTML Cara Membuat Perkalian PHP

Selasa, 07 Juni 2016

Koding  untuk Perkalian di PHP dan HTML

Koding untuk Perkalian di PHP dan HTML

Berikut ini merupakan koding sederhana,untuk melakun proses perhitungan perkalian di dalam web browser dengan menggunkan PHP dan HTML.yang sobat semua pasti bisa untuk membuatnya.

Persiapan :
Editor notepad++
Web browser Crome or firefox.
pastikan akses localhost sobat sudah aktif.

Pertama buat file index.php dan simpan di folder yang sobat tentukan,
kemudian copy contoh koding berikut yang kemungkinan sobat bisa kembangkan koding nya,


<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Koding Sederhana CIWER.ID</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<div class="jumbotron col-md-4">
<div class="panel panel-primary ">
<div class="panel-heading">
<h3 class="panel-title">
CIWER.ID</h3>
</div>
<div class="panel-body">

<!--Koding .PHP-->
<?php
//definisikan setiap variabel yang digunakan
    $nilai1 = "";
    $nilai2 = "";
    $nilai3 = "";
if(isset($_POST['text1'])and
        ($_POST['text2'])
        ){
    $nilai1 = $_POST['text1'];    #mengambil nilai didalam
    $nilai2 = $_POST['text2'];    #formulir sesuai name yang ada
    $nilai3 = $nilai1*$nilai2;
}
?>
<!--end koding .PHP--> 
<form action="index.php" method="post">
    <input type="text" class="form-control" name="text1" value="<?php echo $nilai1?>" placeholder="masukkan angka"><br/>
    <input type="text" class="form-control" name="text2" value="<?php echo $nilai2?>" placeholder="masukkan angka"><br/>
    <input type="submit" class="btn btn-primary" value="Tambah">
 <br/><br/>
    <input type="text" class="form-control" value="<?php echo $nilai3?>"/>
</form>
</body>
</html>

koding di atas,yang pertama kali dilakukan adalah menginisiali variabel yang dibutuhkan, setelah itu, mengambil nilai dari dalam formulir sesuai dengan name masing-masing.

Kemudian pata button form action. Terdapat aksi menuju ke dokumen index.php yang tak lain adalah dokumen untuk file program itu sendiri. Jadi eksekusi program dilaksanakan dengan tujuan formulir . HTML pada dokumen yang sama.

dan koding di atas sudah di lengkpi dengan ccs bootstrap ,yang berfungsi untuk mempercantik tampilan desain contoh program tersebut..

OK sobat sekian semoga artikel ini membantu..
Baca Juga artikel Yang cocok dengan pencarian sobat . Baca disini

Selasa, 10 Mei 2016

apa itu HTML5 ? MENGENAL HTML5

apa itu HTML5 ? MENGENAL HTML5



        Hai sobat blogger apa kabar semua,,,pada sehatkan,ok sobat kali ini saya akan post tentang HTML5,untuk yang hobi design-design web pasti tidak asing lagi dengan HTML5, yah HTML5 memang sangat di kenal di seluruh dunia .tapi pasti masih ada banyak orang yang belom mengenal HTML5,ya termasuk saya sendiri ,,heheh

apa itu HTML5 ? MENGENAL HTML5

HTML (Hypertext Markup Language) Adalah sebuah bahasa untuk menampilkan konten di WEB.HTML sendiri adalah Bahasa pemrograman yang bebas yang artinya tidak di miliki oleh siapapun,pengembanganya di lakukan oleh banyak orang di banayk negara belahan dunia.bisa di sebut bahasa yang di kembangkan bersama-sama secara global.
Dokumen HTML  adalah sebuah dokumen teks yang dapat di edit oleh editor teks apapun,HTML di kelilingi oleh tag-teks yaang di awali dengan < dan berakhiran >.
Contoh dari tag yang di maksut adalah <img src="gambar.jpg"/>,tag ini berfungsi untuk menampilkan gambar yang bernama gambar.jpg ,natinya  gabar akan di tampilkan di web browser jika file Dokumen HTML di buka di web browser.
HTML dapat mencakup petunjuk untuk memformat dalam bahasa yang di sebut css (Cascading style sheets) dan program untuk interaksi dalam bahasa yang di sebut bahasa javascript.tidak perduli halaman web di buat dengan bahasa apapun seperti PHP ,JSP, ASPX Atau cold fusion,dan akhirnya yang ditampilkan oleh browser adalah tetap bahasa HTML murni.HTML awalnya di deain sebagai bahasa untuk pertukaran dokumen teknis.
Versi terbaru dari HTML, adalah HTML5,yang juga membahas mengenai css dan java sript,banyak orang di dunia menyambut kehadiran HTML 5,karena membawa fitur baru yakni canvas untuk membuat sebuah animasidukungan vidio dan audio,serta tag baru untuk mendefinisikan elemen-elemen dokument.

jadi sobat dengan HTML5 ini kita bisa membuat sebuah situs web,web yang canggih dan interaktif.
nah sobat, itu lah sekilas pembahasan tentang HTML dan HTML5, salam kenal yang lagi berkunjung ke blog saya,kritik dan saran sangat bermanfaat  buat saya,dan terimakasih buat sobat yang sudah mampir ke blog saya,, thank's
happy blogger,,