≡ Menu

Cara Membuat Link Goto TOP Pada Website

Goto TOP

Disebagian website pastilah terdapat link yang jika diklik akan menuju ke atas, kebanyakan ada pada website versi wap/mobile. Untuk membuatnya sebenarnya tidak sulit, karena hanya memerlukan HTML berbentuk link saja. Link tersebut sebenarnya ada kegunaanya juga untuk konten yang sangat banyak yang membutuhkan waktu lama untuk skroll, maka untuk itulah kegunaan dari link goto top. Saya sendiri pertama kali membuat website masih tidak tahu apa arti link goto top, dan seiring jalannya waktu akhirnya mengerti juga kegunaanya.

Mungkin jika diversi PC, ada yang menyediakan link goto top ini dibagian pojok bawah berbentuk icon yang besar, namun jika di versi mobile cukyp memberinya difooter saja. Biasanya link ini akan ditemukan di wap ber-kategori download yang menyediakan banyak sekali konten perhalaman dan tidak hanya goto top saja, tapi juga disediakan goto content dan sejenisnya, untuk memudahkan pengguna mobile untuk menuju konten yang diinginkan. Jika kamu pernah menuju wikipedia, pasti pernah menemukan link semacam ini yang menjadi kaitan dari suatu nama. Berikut ini tata cara membuatnya silahkan simak dibawah ini.

  1. Pertama – tama silahkan salin kode HTML dibawah ini dan pasang pada bagian atas halaman (header).

    <a name="top"></a>
  2. lalu silahkan salin lagi kode dibawah ini dan pasang pada bagian bawah halaman (footer).

    <a href="#top">Goto TOP</a>

Sekarang coba klik link Goto TOP, maka secara otomatis tanpa reload akan menuju kebagian atas halaman. Sebenarnya link tersebut bersifat reload, namun berhubungan objeknya satu halaman, maka tidak perlu menggunakan reload lagi. Kamu juga bisa menambahakan gambar atau javascript lain untuk menambah variasi, dan tentunya makin terlihat lebih baik. Diatas hanya contoh sederhana saja dan sengaja Saya bagikan sederhana mungkin, supaya dapat dimengerti dengan mudah.

Jadi intinya, di kode HTML diatas, untuk pertama menggunakan attribute “name” yang memungkinkan browser dapat fokus pada bagian tersebut ketika URL ditambah kode pagar dan nama sesuai attribute tadi. Jika objek “name” tadi tidak ada pada halaman, maka akan terjadi reload/refresh pada halaman. Contoh lain dari kode ini berkerja juga bisa dilihat pada blog ini, dihalaman ini. Coba cari link Add a comment, maka akan diloncatkan ke bagian kolom komentar. Jika ada yang ingin ditanyakan tentang diatas, silahkan berkomentar.

Semoga bermanfaat dan Selamat mencoba

About the author: Apapun yang Saya ketahui dan Saya bagikan. Semuanya berawal dari masa yang disebut pembelajaran.

{ 0 comments… add one }

Leave a Comment