Cara membuat efek hover untuk bentuk tombol menggunakan DHTML dan CSS di FrontPage

Terjemahan Artikel Terjemahan Artikel
ID Artikel: 222949 - Melihat produk di mana artikel ini berlaku.
Perbesar semua | Perkecil semua

RINGKASAN

FrontPage 2000 dan FrontPage 2002 berisi serangkaian kaya Cascading Style Sheet (CSS) dan dinamis HTML (DHTML) authoring kemampuan yang memungkinkan Anda untuk membuat berbagai efek hover. Artikel ini menjelaskan Anda dapat membuat hover tombol efek untuk biasa membentuk bidang tombol dengan menggunakan CSS fitur dan DHTML format.

INFORMASI LEBIH LANJUT

Untuk membuat hover tombol efek untuk bentuk lapangan tombol, Ikuti langkah berikut:
  1. Buat halaman baru, kosong.
  2. Pada Masukkan menu, titik Bentuk, klik Bentuk.
  3. Untuk menerapkan standar"Kirim"tombol warna, ikuti langkah berikut:

    1. Klik kanan Kirim tombol, dan klik Bentuk lapangan properti.
    2. Klik Gaya.
    3. Klik Format, dan kemudian Perbatasan.
    4. Klik Shading tab.
    5. Klik untuk memilih warna dalam Warna latar depan dan Warna latar belakang daftar.
    6. Klik Oke tiga kali untuk kembali ke dokumen.
  4. Untuk menyisipkan DHTML hover warna, ikuti langkah berikut:

    1. Klik Kirim tombol.
    2. Pada Format menu, klik Dinamis HTML efek.
    3. Dalam Pada Daftar, klik untuk memilih Mouse.
    4. Dalam Menerapkan Daftar, klik untuk memilih Pemformatan.
    5. Klik untuk memilih Memilih perbatasan di daftar di sebelah kanan Menerapkan daftar.
    6. Klik Shading tab.
    7. Klik untuk memilih warna dalam Warna latar depan dan Warna latar belakang daftar.
    8. Klik Oke, dan tutup DHTML efek Toolbar.
  5. Untuk memindahkan warna hover tombol Kirim, ikuti langkah-langkah:

    1. Beralih ke tampilan HTML.
    2. Dalam tampilan HTML, bergerak kode berikut dari <p></p> Tag untuk untuk Anda <input> Tag:
         dynamicanimation="fpAnimformatRolloverFP1"
         fprolloverstyle="background-color: #000000; color: #FFFFFF"
         onmouseover="rollIn(this)"
         onmouseout="rollOut(this)"
         language="Javascript1.2"
      								
      Catatan: Nilai "warna latar belakang" dan "warna" mungkin berbeda dari yang ditunjukkan dalam kode sebelumnya.
  6. Jika Anda ingin, ulangi langkah-langkah beberapa terakhir untuk Reset tombol.
  7. Ketika Anda telah menyelesaikan langkah-langkah sebelumnya, kode HTML mungkin terlihat mirip dengan contoh kode HTML berikut:
       <input type="submit" value="Submit"
          style="background-color: #008000; color: #000000"
          dynamicanimation="fpAnimformatRolloverFP1"
          fprolloverstyle="background-color: #000080; color: #FFFFFF"
          onmouseover="rollIn(this)"
          onmouseout="rollOut(this)"
          language="Javascript1.2">
    
       <input type="reset" value="Reset"
          style="background-color: #800000; color: #FFFFFF"
          dynamicanimation="fpAnimformatRolloverFP1"
          fprolloverstyle="background-color: #000080; color: #FFFFFF"
          onmouseover="rollIn(this)"
          onmouseout="rollOut(this)"
          language="Javascript1.2">
    						
  8. Menyimpan halaman ini ke Desktop Anda sebagai"HoverTest.htm"dan meminimalkan FrontPage.
  9. Anda akan melihat bahwa FrontPage menyelamatkan dua berikut file ke Desktop Anda:

    • HoverTest.htm.
    • Animate.js.
    Berkas pertama adalah halaman yang Anda buat dalam sebelumnya langkah-langkah, berkas kedua adalah kumpulan DHTML fungsi yang halaman akan menggunakan.
  10. Terbuka"HoverTest.htm"di Internet Explorer 4.0 atau yang lebih baru. Perhatikan bahwa saat Anda bergerak Anda mouse atas setiap tombol, Anda akan melihat warna yang mengubah

Properti

ID Artikel: 222949 - Kajian Terakhir: 20 September 2011 - Revisi: 2.0
Berlaku bagi:
  • Microsoft FrontPage 2000 Standard Edition
  • Microsoft FrontPage 2002 Standard Edition
Kata kunci: 
kbbutton kbprogramming kbscript kbforms kbnewfile kbhowto kbmt KB222949 KbMtid
Penerjemahan Mesin
PENTING: Artikel ini diterjemahkan menggunakan perangkat lunak mesin penerjemah Microsoft dan bukan oleh seorang penerjemah. Microsoft menawarkan artikel yang diterjemahkan oleh seorang penerjemah maupun artikel yang diterjemahkan menggunakan mesin sehingga Anda akan memiliki akses ke seluruh artikel baru yang diterbitkan di Pangkalan Pengetahuan (Knowledge Base) dalam bahasa yang Anda gunakan. Namun, artikel yang diterjemahkan menggunakan mesin tidak selalu sempurna. Artikel tersebut mungkin memiliki kesalahan kosa kata, sintaksis, atau tata bahasa, hampir sama seperti orang asing yang berbicara dalam bahasa Anda. Microsoft tidak bertanggung jawab terhadap akurasi, kesalahan atau kerusakan yang disebabkan karena kesalahan penerjemahan konten atau penggunaannya oleh para pelanggan. Microsoft juga sering memperbarui perangkat lunak mesin penerjemah.
Klik disini untuk melihat versi Inggris dari artikel ini:222949

Berikan Masukan

 

Contact us for more help

Contact us for more help
Connect with Answer Desk for expert help.
Get more support from smallbusiness.support.microsoft.com