Membuat Background Statis pada Web

Mungkin Anda merupakan salah satu dari beberapa orang yang ingin membuat background web terlihat bagus dan menarik. Ada beberapa permasalahan yang sering muncul saat kita mulai memasang background ke dalam web. Salah satunya seperti yang akan saya bahas di sini hehe

Terkadang setelah memasang background yang tepat untuk kita pasang di web kita, ketika meng-scroll halaman web ke bawah tiba-tiba backgroundnya terlihat putus dan mengulang gambar background yang kita pasang dari awal lagi. Hal ini membuat tampilan web kita menjadi aneh. Apakah Anda pernah mengalami hal itu?

Keadaan background berulang inilah yang disebut dengan background dinamis, karena backgroundnya ikut bergerak mengikuti scroll dengan background yang terulang sampai bawah..

Jika backgroundnya tidak putus dan hanya satu gambar saja, biasanya disebut dengan background statis, karena saat scroll digerakkan ke bawah, background tidak ikut bergerak.

Untuk lebih jelasnya, mari simak yang ini ya..

Misalnya saja, saya mencoba mengganti background dari CSS yang telah saya download. Saya memilih templatemo_368_connect lalu saya ganti dengan gambar yang saya inginkan.

Tampilan asli:

Gambar 1


Lalu setelah diganti backgroundnya, hasilnya seperti ini:

Gambar 2

Pada gambar 2, background terlihat putus dan mengulang gambar dari awal lagi. Mari simak cara mengatasinya hehe

Caranya dengan mengedit file-nya, yang berekstensi .css. Di file CSS yang asli ini, pada bagian atas terdapat sintak:

body {

                margin: 0;

                padding: 0;

                color: #666;

                font-family: Tahoma, Geneva, sans-serif;

                font-size: 12px;

                line-height: 1.5em;

                background-color: #d6d0b8;

                background-image: url(images/templatemo_body.jpg);

                background-repeat: repeat;

                background-position: top center;

}

Untuk mengganti dengan background yang diinginkan, ganti namanya pada background-image misalnya :

background-image: url(images/be.jpg);

Hasilnya akan seperti tampilan Gambar 2.

Untuk membuat background tidak mengulang, kita tinggal menambahkan sintak berikut:

background-attachment: fixed;

Sintak lengkapnya adalah seperti ini:

body {

                margin: 0;

                padding: 0;

                color: #666;

                font-family: Tahoma, Geneva, sans-serif;

                font-size: 12px;

                line-height: 1.5em;

                background-color: #d6d0b8;

                background-image: url(images/be.jpg);

                background-repeat: repeat;

                background-position: top center;

                background-attachment: fixed;

}

Dan hasilnya adalah background berlanjut, jadi tidak terlihat putus dan mengulang gambar lagi seperti ini:

Gambar 3

Lebih terlihat bagus jika backgroundnya seperti ini kan? Ini merupakan background statis, backgroundnya tidak mengikuti pergerakan scroll hehe

Semoga bermanfaat  ^_^

---Anisa---

Read More

Program Java dengan Notepad++

Contoh penggunaan do while

Sintaknya adalah seperti berikut:

//class                               

import java.util.Scanner;//library scanner

public class Do{

            //method

            public static void main (String [] args) {

                       

                       

                        int s;

                        System.out.println("Masukkan variabel s = ");

                        Scanner scan=new Scanner(System.in);//in=input scan=variabel baru ---> untuk menginputkan angka

                        s=scan.nextInt();//int=integer ---> untuk membaca inputan

                        System.out.print("Nilai s adalah ");//menampilkan kembali yg diinputkan tadi

                        System.out.println(s);

                       

                        do {

                        System.out.println(s++);

                                    }

                                    while

                                    (s<=10);

            }

}

Dan apabila di run hasilnya adalah seperti berikut:

---Anisa---

Read More

Membuat Program Java menggunakan notepad++

Menampilkan hasil penjumlahan, pengurangan, perkalian, pembagian dan modulo di command prompt

# Tanpa memasukkan inputan berupa angka (nilai variabel telah ditentukan di program)

Di sini, saya akan menentukan nilai variabel b=6 dan c=2. Dan sintaknya adalah seperti berikut:

public class Tambah{

            //method

            public static void main (String [] args) {

            int b=6;

                        int c=2;

                        int jumlah,kurang,kali,bagi,modulo;

                        jumlah=b+c;

                        kurang=b-c;

                        kali=b*c;

                        bagi=b/c;

                        modulo=b%c;

                        System.out.print("Hasil dari penjumlahan adalah ");

                        System.out.println(jumlah);

                        System.out.print("Hasil dari pengurangan adalah ");

                        System.out.println(kurang);

                        System.out.print("Hasil dari perkalian adalah ");

                        System.out.println(kali);

                        System.out.print("Hasil dari pembagian adalah ");

                        System.out.println(bagi);

                        System.out.print("Hasil dari modulo adalah ");

                        System.out.println(modulo);

            }

            }

Dan setelah running di command prompt, tampilannya adalah seperti berikut:

#  Dengan memasukkan inputan sebagai nilai variabel di command prompt

Di sini, nilai variabel x dan y belum ditentukan, dan sintaknya sebagai berikut:

import java.util.Scanner;

public class Tambah1{

            //method

            public static void main (String [] args) {

            int x,y,jumlah1,kurang1,kali1,bagi1,modulo1;

                        System.out.println("Masukkan variabel x = ");

                        Scanner scan=new Scanner(System.in);

                        x=scan.nextInt();

                        System.out.print("Nilai x adalah ");

                        System.out.println(x);

                       

                        System.out.println("Masukkan variabel y = ");

                        Scanner scan1=new Scanner(System.in);

                        y=scan.nextInt();

                        System.out.print("Nilai y adalah ");

                        System.out.println(y);

                       

                        jumlah1=x+y;

                        kurang1=x-y;

                        kali1=x*y;

                        bagi1=x/y;

                        modulo1=x%y;

                       

                        System.out.print("Hasil dari penjumlahan x dan y adalah ");

                        System.out.println(jumlah1);

                        System.out.print("Hasil dari pengurangan x dan y adalah ");

                        System.out.println(kurang1);

                        System.out.print("Hasil dari perkalian x dan y adalah ");

                        System.out.println(kali1);

                        System.out.print("Hasil dari pembagian x dan y adalah ");

                        System.out.println(bagi1);

                        System.out.print("Hasil dari modulo x dan y adalah ");

                        System.out.println(modulo1);

                       

            }

            }

Dan setelah running di command prompt, tampilannya adalah seperti berikut:

---Anisa---

Read More

Membuat Program Java menggunakan notepad++

Menampilkan kata Hello di command prompt

Perbedaan sintak \t dan \n

Untuk menampilkan kata Hello di command prompt, kita tuliskan dulu sintak-sintaknya di notepad++ lalu kita membuka command prompt dan mengeksekusi programnya di command prompt. Dan di sini, akan ditunjukkan perbedaan hasil dari penggunaan \t dan \n seperti berikut.

Gambar 1

Pada gambar yang pertama ini, terdapat sintak

System.out.println("Hello\t Hello ");

System.out.println("Hello\t Hello ");

Sintak \t ini membuat antara kata Hello dengan kata Hello yang disampingnya terdapat ‘tab’. Println sendiri gunanya untuk berganti baris.

Jadi hasil runningnya à            Hello   Hello

                                                      Hello   Hello

Gambar 2

Pada gambar kedua ini, terdapat sintak

System.out.println("Hello Hello\n");

System.out.println("Hello Hello\n");

Sintak \n ini membuat setelah kata Hello yang kedua akan berganti baris ke bawah. Namun karena sudah menggunakan sintak println (untuk ganti baris), maka antara baris satu dengan satunya terdapat jarak (satu baris kosong).

Jadi hasil runningnya à            Hello Hello

                                                      Hello Hello

Bandingkan jika sintaknya hanya menggunakan print, sbb

Gambar 3

System.out.print("Hello Hello\n");

System.out.print("Hello Hello\n");

Maka hasil runningnya à         Hello Hello

                                                      Hello Hello

Karena tidak menggunakan println, maka tidak ada jarak antar baris. \n hanya untuk berganti baris.

Gambar 4

Pada gambar keempat ini, terdapat sintak

System.out.print("Hello Hello\n");

System.out.println("Hello \t Hello\n");

System.out.print("Hello\t Hello\n");

Di sini, penggunaan sintak \t dan \n digunakan secara bersama. Dan hasil runningnnya adalah sebagai berikut à Hello Hello

Hello            Hello

Hello            Hello

Yupzzz seperti itulah perbedaan dari \n dan \t    ^^

---Anisa---

Read More

Make the GIF Project

Ini merupakan project pertama saya dalam membuat gambar bergerak (GIF) dengan menggunakan adobe flash. Dan saya mengerjakannya dengan rekan saya Anggun Nofitasari.

Lucu kan Ya??? 

--Anisa--

Read More

Notasi Google Earth SMA-ku

Membaca judul entri saya kali ini, rasanya pasti terdengar aneh hehe

Sebenarnya ini adalah tugas untuk membuat notasi SMA masing-masing mahasiswa di google earth. Dan saya akan membuat notasi SMA N 1 Surakarta.

~ Pertamanya, yang pasti harus dilakukan adalah menginstall google earth pro.

~ Lalu, masukkan alamat atau nama SMA yang dicari di kotak search sebelah kiri.

~ Setelah gambar dan lokasi SMA muncul, klik icon add placemark di bagian atas seperti    gambar di samping.

~ Letakkan pada lokasi SMA, lalu ganti name dengan nama SMA, dan isikan description seperlunya. Di sini saya mengambil deskripsi dari portal SMA N 1 Surakarta dari link http://sman1-slo.sch.id.

~ Lalu, atur Style, Color dari name dan icon sesuai yang diinginkan

~ Icon dapat juga memilih gayanya di gambar icon samping name.

Dan seperti ini hasil dari saya membuat notasi SMA N 1 Surakarta:

                         

Saya memberikan warna hijau pada notasi google SMA N 1 Surakarta yang saya buat. Seperti tampilan di gambar di atas.

-- Anisa --

Read More

Geographic Information System --> aplikasi pencarian taksi terdekat

         

        Geographic Information System disingkat GIS atau dalam bahasa Indonesia Sistem Informasi Geografis (SIG) adalah sistem informasi khusus yang mengelola data yang memiliki informasi spasial (bereferensi keruangan). 

(Sumber: http://id.wikipedia.org/wiki/Sistem_informasi_geografis)

       Salah satu software yang berhubungan dengn GIS yakni google earth (3D). banyak aplikasi yang dapat dibuat dengan google earth, dan yang pasti aplikasinya sangat bermanfaat. Misalnya untuk membat aplikasi pencarian taksi terdekat. Dan ulasannya dapat diunduh di:

 (download ulasan aplikasi pencarian taksi terdekat)

link dokumen sumber: http://repo.eepis-its.edu/1203/1/Paper_7408030008.pdf

--Anisa--

Read More