jQuery範例 – Apple產品導覽介面製作

這次的jQuery應用範例要來試做的是Apple官方網頁上面有關產品介紹的介面。

Apple 官網產品介紹頁面截圖

主要用到的圖檔除了各產品的照片之外,就只有兩張,一個是底部的漸層,另一個是三角形箭頭。

另外當然是用到了jQuery和CSS的語法,CSS中有3.0的語法,所以圓角、陰影…等都不是圖檔構成,有想要研究的可以看看馬老師製作的範例檔下載)、範例檔2下載),大家看完後有任何問題歡迎在此回應,謝謝!

註:本範例所使用的圖片版權屬於Apple與Adobe公司所有。

You may also like...

13,113 Responses

  1. Davidmer表示:

    lasix medication: lasix medication – lasix 40 mg

  2. Andreproda表示:

    Обработка подвала после затопления канализацией https://klining-posle-zaliva-moskva.ru/

  3. Davidmer表示:

    neurontin gabapentin: neurontin 300 mg caps – neurontin 300 mg tablet

  4. JamesTus表示:

    Очистить дом после пожара https://uborka-posle-pozhara-495.ru/

  5. DouglasAmevy表示:

    Азино

  6. Sergiohex表示:

    https://furosemide.men/# lasix 100 mg

  7. JosephWrela表示:

    ventolin otc canada: Ventolin inhaler price – salbutamol ventolin

  8. Robertdaw表示:

    Сайт предоставляет информацию о биодобавках http://биодобавки.рф состав, польза и рекомендации по применению. Здесь вы найдёте обзоры эффективных добавок для улучшения здоровья, иммунитета и энергии на основе научных данных и экспертных мнений.

  9. JosephFam表示:

    rybelsus cost: cheap Rybelsus 14 mg – Buy compounded semaglutide online

  10. Профессиональный сервисный центр по ремонту компьютеров и ноутбуков в Москве.
    Мы предлагаем: срочный ремонт макбука
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  11. Sergiohex表示:

    https://rybelsus.tech/# Semaglutide pharmacy price

  12. RhysGed表示:

    Для получения бонуса от Мелбет переходите на официальный сайт букмекерской конторы и в верхнем правом углу нажмите на кнопку «Регистрация». Выбирайте удобный для вас способ завести аккаунт и тщательно заполните данные. В каждом из вариантов будет поле «Промокод». Скопируйте промокоды на кз с нашего сайта и вставьте в окошко. Система уведомит вас, что введенные символы рабочие и ваш бонус повышен на 30%. Не торопитесь сразу же пополнять баланс созданного аккаунта. Рекомендуем сразу заполнить требуемую информацию в личном кабинете и пройти верификацию, чтобы после выигрыша деньги вывелись быстро и без проблем.

  13. Davidmer表示:

    lasix dosage: lasix 100 mg – lasix online

  14. Davidmer表示:

    buy prednisone 5mg canada: prednisone 20 mg pill – cortisol prednisone

  15. JosephWrela表示:

    lasix dosage: cheap lasix – lasix uses

  16. JosephFam表示:

    neurontin 300mg tablet cost: gabapentin 100mg – canada neurontin 100mg lowest price

  17. Профессиональный сервисный центр по ремонту бытовой техники с выездом на дом.
    Мы предлагаем: сервисные центры по ремонту техники в тюмени
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  18. Gartandabsex表示:

    Как поднять настроение с помошью анекдота. ржачные мемы
    https://www.dermandar.com/user/vychislavyakov./

  19. Michaeltot表示:

    Сайт о биодобавках https://биодобавки.рф предлагает проверенную информацию о натуральных добавках для здоровья. Узнайте, как выбрать подходящие средства для улучшения иммунитета, повышения энергии и поддержания активного образа жизни. Подробные описания и советы помогут сделать осознанный выбор.

  20. Профессиональный сервисный центр по ремонту бытовой техники с выездом на дом.
    Мы предлагаем: сервисные центры по ремонту техники в тюмени
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  21. Davidmer表示:

    Buy compounded semaglutide online: buy semaglutide online – cheap Rybelsus 14 mg

  22. Davidmer表示:

    Buy semaglutide pills: rybelsus generic – rybelsus

  23. JosephWrela表示:

    buy lasix online: cheap lasix – lasix generic name

  24. Jamielib表示:

    7k

  25. JerryVam表示:

    Zooma

  26. Sergiohex表示:

    https://rybelsus.tech/# semaglutide

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。