Kami melompat ke depan hanya sedikit remaja di sini. Ini adalah siri screencast yang cukup komprehensif, tetapi hanya 40 jam atau lebih dan sudah tentu projek sebenar ini sebenarnya lebih kurang beberapa ratus. Dalam kes ini, lompatan ke depan adalah untuk menambah sedikit penyebaran dua halaman. Kami melalui perubahan tersebut pada awalnya.
Halaman kiri dan kanan mempunyai satu nama kelas yang dikongsi dan satu yang berbeza. Ini sangat biasa saya dapati dalam banyak senario yang berbeza dalam reka bentuk web. Dalam kes ini, halaman mempunyai kecerunan yang sama dan ukuran yang sama. Tetapi mereka berbeza ketika kita menerapkan skew()transformasi CSS3 . Ini memberi kita kesan "buku terbuka" yang agak kemas. Oleh kerana semua kesan ini dibuat dengan CSS, skala mereka baik (dengan cara yang pasti gambar tidak akan).
Kami mempunyai penyelesaian ketinggian sama pintar, tetapi sayangnya kerana buku skew-y buku terbuka kami yang cerdas, ia rosak. Sebaliknya, kami hanya menggunakan sentuhan JavaScript.
Pertama, sambil melihat JavaScript, kita menulis baris yang akan menyembunyikan mana-mana "huruf" yang tidak mempunyai anak. Sebagai contoh, tidak ada pemilih yang diawali dengan "Z" tetapi kami mempunyai halaman yang diterbitkan yang disebut agar komprehensif. Kami menemui mereka (dan kemudian menyembunyikannya) dengan :has()pemilih jQuery yang sangat berguna .
Untuk ketinggian yang sama, kami mengukur kedua-dua lajur, memutuskan mana yang paling tinggi, dan kemudian menetapkan keduanya ke yang paling tinggi. Kita mesti menggunakan setTimeout yang agak gementar agar ia berfungsi dengan betul kerana pemuatan @ font-face mengambil sedikit masa dan mempengaruhi ketinggian. Kami akhirnya dapat menggunakan semacam panggilan balik pemuat fon. (Atau, itu mungkin berlebihan).
Kemudian kami beralih ke halaman almanak tunggal. Lori dengan pantas sekarang! Kami telah melakukan perkara seperti ini berkali-kali sekarang dan tidak hairanlah kita bergerak lebih pantas. Kami pada dasarnya melengkapkan templat ini ke bentuk dengan cara yang sama seperti kita menyusun satu catatan blog atau halaman umum atau yang serupa dengannya.
Kami menggunakan "bar hitam" untuk serbuk roti, menyusun corak reka bentuk ini sebagai sesuatu yang akan kami gunakan berulang kali untuk navigasi bahagian laman web.