Halloween party ideas 2015
Tampilkan postingan dengan label html. Tampilkan semua postingan
Tweet Share Share Share Share Share

2/11/2017

Pada artikel belajar jquery kali ini kita akan membuat slide, dima slide tersebut mempunya empat konten yang dapat dipilih dan akan menampilkan konten tersebut.

Berikut langkah-langkahnya.

Seperti biasa jalankan xampp terlebih dahulu, buka file xampp/htdocs dan buat folder baru dengan nama jquery dan didalam folder jquery tersebut buatlah file baru seperti dibawah ini.

jquery.js


jquery.easyAccordion.js

utility.js
easyAccordion.css

Jika sudah selesai disalin, selanjutnya download file image dan extract, kemudian simpan didalam folder xampp/htdocs/jquery.

Selanjutnya buka browser dan jalankan url: http://localhost/jquery/accord.html , maka akan tampil seperi gambar dibawah ini.
Download Source Code Disini


Selian dan terima kasih, semoga bermanfaat.
Read more »
Tweet Share Share Share Share Share

2/11/2017

Hallo semua, kali ini saya bagikan tutorial jQuery membuat effek gambar hover, ini biasanya digunakan untuk tampilan slide show, atau tampilan bagian awal konten website.

Berikut langkah-langkahnya..

Pertama jalankan xampp yang ada di kamputer anda, selanjutnya buka file xampp/htdocs, Selanjutnya dalam folder htdocs buatlah folder baru dengan nama jquery.

selanjutnya buatlah file baru dalam folder jquery dan simpan sesuai dengan extensi seperti dibawah ini. catatan:  setiap file yang dibuat salinlah kode yang terterah dibawah ini sebelum disimpan.

jquery.js


jquery.olbersblog.min.js
style.css

hover.html



 Sika sudah selesai, selanjutnya copy dan paste file berupa gambar dengan type .PNG kemudian gambar-gamber tersebut di berinama 1, 2, 3, 4. 

 selanjutnya buka browser anda dan jalankan url : http://localhost/jquery/hover.html ,Maka akan tampil seperti pada gambar dibawah ini.

Download Source Code

Sekian dan Terima kasih, semoga bermanfaat.
Read more »
Tweet Share Share Share Share Share

2/07/2017

Hallo guys, pada tutorial jQuery kali ini kita akan membuat beberapa tampilan diantaranya adalah Effect Slide, Event, dan Selector. untuk persiapan kita jalankan terlebih dahulu xampp.

Berikut langkah-langkahnya.

Peratama buka file xampp/htdocs, dan buat folder baru dengan nama jQuery.

Selanjutnya dalam folder baru jQuery yang telah dibuat sebelumnya buatlah file baru seperti dibawah ini dan salin kode-nya :

jquery-1.8.0.min.js



 efek_slide.html

event.html



 selector_class.html
selector_id.html
selector_tag.html
selector_tag2.html

Setelah selesai save, dan jalankan browser. kemudian pada tab link ketikkan link beikut:
http://localhost/jquery/ maka akan muntul beberapa file seperti pada gambar dibawah ini.
Jika sudah tampil seperti di atas, pilih salah satu file dan klik. contoh disini saya klik file event.html maka akan tampil seperti pada gambar berikut.
Sekian dan terima kasih, semoga bermanfaat. Salam hangat Blog: Kupas Tuntas Mengenai IT (informasi teknologi)
Read more »
Tweet Share Share Share Share Share

1/22/2017

Hallo guys, pada tutorial kali ini kita akan belajar membuat sebuah tombol yang berfungsi untuk menampilkan gambar dan menghilangkan gambar ketika tombol-tombol tersebut di klik.
Tutorial ini menggunakan html dan JQuery.

Langsung saja ke langkah-langkahnya.

Pertama buka file xampp/htdocs anda, dan buatlah sebuah folder baru. sebagai contoh disini saya berikan nama jquery

Selajutnya buatlah sebuah file dalam folder jquery tersebut dengan nama pertama.html dan jquery-1.8.0.min. Kemudian salin code berikut ini.

pertama.html


jquery-1.8.0.min



 Setelah disave, tambahkanlah satu file foto dengan nama @olbers.l dengan tipy file jpg/jpeg.

Selanjutnya jalankan dibrowser dengan url: http://localhost/jquery/pertama.html
Maka hasilnya seperti di bawah ini.

Keterangan: Pada saat user meng-klik tombol sembunyi maka gambar akan hilang, dan sebaliknya jika user meng-klik tombol tampil, maka gambar akan muncul. Selamat mencoba.

Semoga Bermanfaat,. Sekian dan Terima Kasih.
Read more »
Tweet Share Share Share Share Share

1/10/2017
jQuery adalah  javascript library ⇄ kumpulan kode/fungsi javascript siapa pakai, sehinggah mempermudah dan mempercepat kita dalam membuat kode Javascript. Secara standar, apabila kita membuat kode Javasript, maka diperlukan kode yang cukup panjang, bahkan sangat sulit dipahami. misalkan javascript sebagai berikut:



Peran jQuery adalah sebagai JavaScript Library, dimana kita bisa langsung memanggil fungsi yang terdapat didalam librari tersebut.

Kesimpulan, jQuery menyederhanakan kode javascript, hal ini sesuai dengan slogannya "write less, do more" cukup tulis sedikit tapidapat melakukan banyak hal

Sekian untuk pengenalan singkat tentang JQuery. Baca artikel cara menggunakan jQuery selanjutnya.

Read more »
Tweet Share Share Share Share Share

1/09/2017

Cara mudah membuat website responsive satu halaman dengan php dan html.
Pada artikel kali ini saya berbagi Desain Web Responsif Satu Halaman sekarang ini web desain responsif sangat populer bagi situr perusahaan besar. desain ini sangat mendukung tampilan yang baik pada semua perangkat. untuk merancang web seperti ini kita dapat menggunakan html, css, dan jquery

Tampilan seperti berikut
Contoh tampilah halaman dimobile

Contoh tampilah halaman menu dimobile
Nonto Demo by:Video Olbers Blog

Download Template disini

Sekian dan terima kasih. Salam hangat Blog: Kupas Tuntas Mengenai IT
Read more »
Tweet Share Share Share Share Share

1/09/2017

Pada tutorial kali ini saya akan membagikan bagaimana cara membuat aplikasi kalkulator cinta dengan menggunakan web php, javascript, dan html.

Aplikasi kalkulator cinta ini bertujuan untuk menghitung seberapa persen kekasih kita menyayangi dan mencintai kita. aplikasi yang dibuat akan dijalankan diweb browser seperti, chrome, mozilla, operamini, dan web browser sejenisnya.

Okey langsung saja kelangkah-langkah pembuatannya.

Pertama jalankan Control Panel Xampp anda.

Kedua buatlah sebuah folder baru di xampp/htdocs dan berinama kalkulator_cinta

Ketiga, buatlah file baru dan berinama index.php, kalkulator.php, dan style.css

 Selanjutnya salin/paste kode di bawah ini untuk setiap file yang telah kita buat.

Index.php


kalkulator.php


style.css


Keempat, buatlah folder baru dalam folder kalkulator_cinta dan beri nama img. download gambar disini

Jika sudah, buka browser dan jalankan dengan url: localhost/kalkulator_cinta. Maka, akan tampil seperti berikut.


Download Aplikasi Kalkulator Cinta


Sekian dan terima kasih
Read more »
Tweet Share Share Share Share Share

1/07/2017

pada Tutorial kali ini kita akan lanjutkan dengan membuat halaman web admin. pada tutiral sebelumnya kita telah membuat tutorial web publik sederhana. dengan judul posting. Belajar Membuat Website Dengan PHP dan MySQL nah, untuk berikut ini kita akan membuat halaman admin, dimana halaman ini berfungsi untuk mengelolah data yang diinputkan oleh pengelolah sehinggah data/artikel tersebut tampil pada halaman web public.
Tutorial Sebelumnya
Berikut cara-cara pembuatanya..

Pada tutorial sebelumnya kita telah membuat halaman web public, dan kali ini kita akan lanjut dengan membuat halaman web admin. Masuk ke xampp/htdocs/latihan (folder latihan)

Selanjutnya dalam folder latihan buatlah sebuah folder baru dan beri nama admin, dan dalam folder admin tersebut buatlah beberapa file. Berikut file-file tersebut adalah: index.php, home.php, login.php, keluar.php, akun.php, detail.php,  edit.php, hapus.php, pesan.php, detail-pesan.php, hapus-pesan.php, post.php, tambah.php, tambah-data.php.

Kemudian tambahkan kode berikut pada setiap file, seperti dibawah ini.
index.php


 home.php


akun.php


 detail.php


 edit.php


 hapus.php

post.php

tambah.php



 tambah-data.php

pesan.php

detail-pesa.php

hapus-pesan.php

login.php

keluar.php

 Jika sudah selesai, buka browser dan ketikkan url: localhost/latihan/admin, maka akan tampil seperti halaman di bawah ini.
Masukkan user nama dan password, dan klik tombol login, makan anda akan masuk ke halaman pengelolah data web, tampilan seperti berikut.

Sekian dan terima kasih, semoga bermanfaat.

Baca artikel sebelumnya
Download Source Code Tutorial Membuat Halaman Admin
Read more »
Tweet Share Share Share Share Share

1/06/2017
Hallo guys, pada tutorial kali ini saya akan membagikan cara mudah membuat website sederhana dengan php dan mysql.
Pada tutorial ini kita akan belajar bagaimanan membuat web dari awal pembuatan database, tabel-database, membuat koding dan lainnya untuk menampilkan sebuah website yang dapat di jalankan di browser. 

Artikel lanjutan
Dalam pembuatan web sederhana dengan php dan mysql ini yaitu, untuk menampilkan data seperti judul/nama, merek, deskripsi/detail, dan sebagainya. Contohnya seperti web informasi toko online.

Langkah-langkah pembuatan web sederhana dengan php dan mysql seperti berikut.

Langkah pertama yaitu menjalankan control panel xampp, dan kita menuju ke localhost/phpmyadmin untuk membuat database.

Selanjutnya database kita dibuat dan beri berinama (latihan) tanpa tanda kurung.

Setelah berhasil membuat database baru dengan nama latihan, selanjutnya kita akan membuat tabel pada database latihan. tabel-tabel tersebut adalah: tbladmin, tblkirim, tblolberspost, tblpesan, tbltglpost. 

Untuk membuat tabel-tabel tersebut, kita klik pada database kita di localhost/phpmyadmin yaitu latihan dan klik pada item SQL  dan salin/paste perintah SQL di bawah ini dalam form sql.

TBLADMIN

Setelah lah itu klik tombol kirim/send dibagian bawah kiri. jika berhasil maka tbladmin telah di buat pada database latihan.

Lakukan perintah di atas untuk membuat tabel lainnya

TBLKIRIM

TBLOLBERSPOST


TBLPESAN

TBLTGLPOST

Setelah semuanya berhasil dibuat maka pada database latihan sudah ada tabel. Tampilan seperti berikut.


Langkah selanjutnya membuat tema/template web, download template disini

Setelah download, extract file tersebut di xampp/htdocs, dan pada file latihan buatlah  file baru didalamnya dengan nama index.php, kemudian salin/paste kode di bawah ini di file index.php
Langkah berikut, buat folder baru dalam folder latihan. Folder tersebut saya beri nama obel.


Selanjutnya pada masih pada folder obel, buatlah beberapa file baru, file tersebut adalah: content.php, kirim-pesan.php, kontak.php, olbers.php, pencarian.php, tentang.php. 

Kemudian salin kode dibawah ini, pada setiap file tersebut.

content.php


kirim-pesan.php


kontak.php


olbers.php


pencarian.php


tentang.php



Langkah selanjutnya kita akan membuat koneksi database, masih pada folder latihan, buat filder baru dengan nama config dan buatlah file baru di dalamnya dengan nama koneksi.php

 Selanjutnya salin/paste kode dibawah ini pada file koneksi.php.


Selanjutnya simpan dan jalankan di browser, localhost/latihan, maka akan tampil seperti berikut. 

Tutorial Lanjutan
Download Source Code Membuat Website Sederhana Dengan PHP Dan MySQL
Read more »
Langganan: Komentar (Atom)

Formulir Kontak

Nama

Email *

Pesan *

Kupas Tuntas Mengenai IT © 2015. All Rights Reserved.
Powered By Olbers

Olbers Letfaar

{picture#https://scontent-sit4-1.xx.fbcdn.net/v/t1.0-9/20032047_1702672473095128_6121814837846983047_n.jpg?oh=f1fb4da2b34a71d9ee0569e2620af150&oe=59F110E3} OlbersBlog adalah, web blogger tentang kupas tuntas mengenai IT (Information Teknologi). Kami berbagi mengenai bahasa pemrograman dan aplikasi lainnya yang telah kami pelajari. {facebook#https://www.facebook.com/Olbers.letfaar} {twitter#https://twitter.com/olbers_blogger} {google#https://plus.google.com/u/0/101511063281433926732} {youtube#https://www.youtube.com/channel/UCwWx1puRihmbypokQyvXFQA} {pinterest#YOUR_SOCIAL_PROFILE_URL}
Diberdayakan oleh Blogger.