Daftar Isi:
Video: From Adobe XD Prototype to HTML, CSS & JS - Making an Animated Mega Menu 2024
Adobe Edge Animate CC sangat HTML-friendly. Jika Anda memiliki situs HTML yang ada - meskipun sangat dasar - yang ingin Anda bernyawa, maka cukup klik Open File dari layar Welcome untuk mulai bekerja dengannya.
Pastikan semua gambar dan file yang terkait berada dalam folder yang sama dengan file htm saat Anda membukanya - atau di folder bersarang di file htm. Jika tidak, mereka tidak akan muncul di Panggung.
Saat mengimpor HTML yang ada, perhatikan hal berikut:
-
Edge Animate mungkin tidak menyukai file CSS Anda
-
Gambar di file htm Anda muncul di panel Library.
-
Teks diimpor sebagai elemen.
Kemungkinan masalah dengan file CSS
Ingatlah bahwa halaman HTML yang lebih sederhana adalah yang Anda impor, semakin mudah bagi Edge Animate untuk membukanya.
Jika Anda memiliki masalah dalam membuka file htm Anda, coba hapus semua file CSS yang terkait. Anda mungkin khawatir dengan kehilangan pekerjaan sebelumnya, namun ingatlah bahwa Anda dapat dengan cepat mengganti semua pekerjaan desain itu dengan Edge Animate.
Jika Anda membuka file HTML yang ada dengan menu dan menu seperti itu, Anda dapat menghidupkan menu dan elemen, namun Anda tidak dapat memformat ulang warna dan beberapa aspek lainnya.
Alasan untuk ini adalah bahwa Edge Animate hanya memungkinkan urutan animasi untuk objek HTML yang diimpor agar tidak bertarung dengan gaya CSS yang mungkin sudah Anda terapkan. Ini bisa menjadi agak berantakan saat Anda menerapkan dua gaya ke elemen, yang dapat menyebabkan hasil yang tidak diharapkan.
Gambar muncul di panel Library
Jika halaman HTML yang Anda impor berisi gambar, maka Edge Animate akan mengimpor gambar tersebut ke panel Library sebagai aset (lihat gambar ini).
Di sini ikon Edge Animate asli diimpor sebagai aset ke panel Library.Anda sekarang dapat memperlakukan gambar yang diimpor sebagai elemen yang dapat Anda menghidupkan atau menambahkan atribut interaktif; Anda dapat membuat gambar bergerak di sekitar layar dan / atau membuat gambar menjadi link.
Teks diimpor sebagai elemen
Bila Anda mengimpor file HTML dengan teks, Animate mengimpor teks itu sebagai elemen. Anda dapat memilih elemen teks dan menghidupkannya atau menambahkan tindakan padanya; Namun, Anda tidak bisa mengedit teksnya.
Jika file HTML asli menggunakan tag H1 atau paragraf untuk teks, maka Animate mengenali atribut tersebut dan menampilkannya di panel Elemen, seperti yang ditunjukkan.
Teks diimpor sebagai elemen.