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

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

Apple 官網產品介紹頁面截圖

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

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

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

You may also like...

11,937 Responses

  1. WilliamRhype表示:

    https://ciprofloxacin.tech/# purchase cipro

  2. Lhaneevige表示:

    В наше время, когда диплом – это начало удачной карьеры в любой отрасли, многие ищут максимально быстрый и простой путь получения образования. Наличие официального документа об образовании сложно переоценить. Ведь диплом открывает дверь перед каждым человеком, желающим вступить в сообщество профессиональных специалистов или учиться в любом ВУЗе.
    В данном контексте мы предлагаем оперативно получить этот важный документ. Вы можете приобрести диплом, и это будет удачным решением для человека, который не смог закончить обучение или утратил документ. дипломы изготавливаются аккуратно, с особым вниманием к мельчайшим деталям, чтобы в итоге получился документ, 100% соответствующий оригиналу.
    Преимущества этого решения состоят не только в том, что можно оперативно получить диплом. Весь процесс организовывается комфортно, с профессиональной поддержкой. От выбора подходящего образца диплома до точного заполнения личных данных и доставки в любой регион страны — все под абсолютным контролем квалифицированных мастеров.
    Всем, кто ищет быстрый и простой способ получить необходимый документ, наша компания предлагает выгодное решение. Приобрести диплом – это значит избежать длительного обучения и не теряя времени переходить к своим целям: к поступлению в университет или к началу удачной карьеры.

    https://diplomanc-russia24.com

  3. Ronaldpsymn表示:

    https://cytotec.club/# buy cytotec over the counter

  4. WilliamRhype表示:

    https://finasteride.store/# cost cheap propecia online

  5. RandallTaulp表示:

    prinivil drug cost: lisinopril 2019 – cheapest lisinopril 10 mg

  6. Davidtes表示:

    buy cipro cheap buy ciprofloxacin over the counter cipro online no prescription in the usa

  7. RandallTaulp表示:

    price of lisinopril generic: prinivil 20 mg tablet – lisinopril 20 mg over the counter

  8. WilliamRhype表示:

    https://nolvadex.life/# tamoxifen breast cancer prevention

  9. WilliamRhype表示:

    http://cytotec.club/# Abortion pills online

  10. Ronaldpsymn表示:

    http://finasteride.store/# cost of propecia pills

  11. Davidtes表示:

    generic propecia pill propecia brand name buy cheap propecia without insurance

  12. Ronaldpsymn表示:

    http://nolvadex.life/# does tamoxifen cause weight loss

  13. WilliamRhype表示:

    http://finasteride.store/# order cheap propecia tablets

  14. Shaneevige表示:

    В современном мире, где диплом – это начало успешной карьеры в любом направлении, многие пытаются найти максимально быстрый путь получения образования. Наличие документа об образовании переоценить попросту невозможно. Ведь именно он открывает двери перед людьми, стремящимися вступить в сообщество профессиональных специалистов или продолжить обучение в каком-либо ВУЗе.
    В данном контексте мы предлагаем оперативно получить этот необходимый документ. Вы можете купить диплом, и это является удачным решением для человека, который не смог закончить обучение, утратил документ или желает исправить плохие оценки. Все дипломы производятся с особой аккуратностью, вниманием к мельчайшим деталям, чтобы в итоге получился полностью оригинальный документ.
    Преимущество данного подхода состоит не только в том, что можно оперативно получить диплом. Процесс организовывается просто и легко, с профессиональной поддержкой. От выбора подходящего образца документа до грамотного заполнения персональных данных и доставки по стране — все будет находиться под полным контролем квалифицированных специалистов.
    В результате, для тех, кто ищет быстрый и простой способ получения требуемого документа, наша компания готова предложить отличное решение. Заказать диплом – значит избежать продолжительного процесса обучения и не теряя времени переходить к личным целям: к поступлению в университет или к началу успешной карьеры.
    https://diploman-russiyans.com

  15. Rickysem表示:

    reputable mexican pharmacies online mexico pharmacy mexico pharmacies prescription drugs

  16. Ebqfcc表示:

    order famvir 500mg for sale – famciclovir tablet buy generic valcivir for sale

  17. Marcelabelp表示:

    http://indiaph24.store/# indian pharmacies safe

  18. JustinCit表示:

    cheapest online pharmacy india http://indiaph24.store/# india pharmacy
    cheapest online pharmacy india

  19. Pedroereva表示:

    buying prescription drugs in mexico online: medication from mexico pharmacy – pharmacies in mexico that ship to usa

  20. Pedroereva表示:

    purple pharmacy mexico price list: cheapest mexico drugs – buying from online mexican pharmacy

  21. Stevenrip表示:

    world pharmacy india: Generic Medicine India to USA – top 10 online pharmacy in india

  22. Marcelabelp表示:

    https://indiaph24.store/# india online pharmacy

  23. JustinCit表示:

    world pharmacy india https://indiaph24.store/# reputable indian online pharmacy
    reputable indian pharmacies

  24. Michaelcew表示:

    https://mexicoph24.life/# mexican pharmaceuticals online

  25. Rickysem表示:

    canadianpharmacyworld com Prescription Drugs from Canada is canadian pharmacy legit

  26. JustinCit表示:

    buy prescription drugs from india https://indiaph24.store/# reputable indian online pharmacy
    buy prescription drugs from india

  27. Pedroereva表示:

    buying prescription drugs in mexico: cheapest mexico drugs – mexican mail order pharmacies

  28. Gbgztn表示:

    ketoconazole over the counter – lotrisone for sale sporanox 100 mg us

  29. Rickysem表示:

    mexican online pharmacies prescription drugs mexico pharmacies prescription drugs buying prescription drugs in mexico

  30. Marcelabelp表示:

    http://indiaph24.store/# indian pharmacies safe

發佈留言

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