virtual bookshelf

رف الكتب الافتراضي

هذا تصور بسيط للكتب على رف الكتب باستخدام بعض التحويلات CSS لإعطاء تأثير اختيار الكتاب عند التحوم فوقه.

أستخدمه على موقعي الشخصي لتتبع الكتب التي قرأتها. إنه يتكامل بشكل جيد مع مولدات الموقع الثابتة ، وبشكل جيد ، أي شيء تقريبًا نظرًا لأن كل ذلك هو الفانيليا JS و CSS و HTML.

كيف أضيف المزيد من الكتب؟

يتم تعريف كتاب على النحو التالي:

 < div class =" book " >
    < div class =" side spine " >
        < span class =" spine-title " > Book Title </ span >
        < span class =" spine-author " > PG </ span >
    </ div >
    < div class =" side top " > </ div >
    < div class =" side cover " > </ div >
</ div >

ما عليك سوى إضافة هذا المقتطف لكل كتاب تريده داخل <div class="bookshelf"> .

لماذا تستخدم JS على الإطلاق؟

كنت أهدف في الأصل إلى تطبيق NO-JS ولكن لم يكن هناك طريقة لإضافة العشوائية إلى ارتفاع الكتاب والألوان والأنماط بدونه. يمكنك بالطبع إزالة JS وتنفيذ تلك الأشياء يدويًا.

هل هذا مجاني للاستخدام؟

نعم ، افعل ما تريد به.

إذا وجدت هذا المشروع مفيدًا ، فيمكنك الاستفادة من الشارة التالية لنشر الكلمة:

هل هو مثالي؟

لا. لا تتعامل مع العناوين الطويلة بشكل جيد. أنا متأكد من أن هناك قضايا محاذاة أخرى. كتبت هذا في يوم واحد ، لا تتوقع الكثير. لا تتردد في تقديم الإصلاحات/التحسينات.