Bagaimana untuk membuat imej rollover dengan kod HTML

Pengarang: Marcus Baldwin
Tarikh Penciptaan: 21 Jun 2021
Tarikh Kemas Kini: 11 November 2024
Anonim
HTML Image Submit Buttons (with Rollover) Tutorial
Video.: HTML Image Submit Buttons (with Rollover) Tutorial

Kandungan

Dengan berjuta-juta laman web yang ada di internet, adalah penting bahawa anda adalah unik. Satu teknik yang digunakan untuk menambahkan kesan dinamik ke laman web ialah "imej rollover", juga dikenali sebagai "butang rollover". Pada dasarnya, apabila pengunjung melayang ke atas imej, ia berubah, dan kembali normal apabila mouse dikeluarkan. Ini boleh digunakan untuk beberapa kesan halus, seperti menukar warna imej atau surat. Anda boleh membuat imej peralihan sendiri dengan pemformatan HTML asas dalam pelbagai program reka bentuk.


Arahan

Buat laman web dinamik dengan bantuan imej rollover (Jupiterimages / Photos.com / Getty Images)
  1. Buat dokumen baru saiz yang dikehendaki (dalam piksel) menggunakan perisian pengeditan imej seperti Photoshop. Buat imej biasa dan "rollover", yang mesti saiz yang sama.

  2. Simpan kedua-dua imej secara individu dengan pergi ke menu "Fail" dan pilih "Simpan". Gunakan format JPEG, GIF atau PNG. Walaupun dua yang pertama adalah yang paling biasa digunakan, PNGs mengekalkan ketelusan. Pastikan anda menyimpan imej itu ke folder root tempatan laman web anda.

  3. Buka perisian reka bentuk yang sesuai, seperti Adobe Dreamweaver. Klik butang "Muat semula" di perpustakaan untuk mengemas kini perpustakaan dan folder root tempatan untuk tapak anda. Cari imej dalam folder akar.

  4. Tukar ke paparan kod halaman web.


  5. Taipkan "

    "Dalam kod itu, tanpa sebut harga mula.

  6. Ganti "http://yoursite.com" dengan alamat laman web anda. Juga gantikan "IMAGE1" dan "IMAGE2" dengan nama-nama imej biasa dan "rollover" masing-masing.

Apa yang anda perlukan

  • Perisian Penyuntingan Imej
  • Perisian reka bentuk web