本書有DRM加密保護,需使用HyRead閱讀軟體開啟
  • 跨裝置網頁設計:HTML 5、CSS 3、JavaScript、jQuery Mobile快速建立電腦&行動網站
  • 點閱:2931
  • 作者: 陳惠貞作
  • 出版社:碁峰資訊
  • 出版年:2013[民102]
  • ISBN:978-986-347-021-2 ; 986-347-021-X
  • 格式:PDF
  • 版次:初版
  • 附註:本電子書含光碟資料,購買/借閱後至個人書坊下載 原紙本書ISBN:978-986-276-925-6(租書不含光碟資料)

內容簡介

‧HTML 5元素和各種表單輸入類型,包括表單的後端處理。
‧CSS 3的字型、文字、清單、色彩、背景、漸層、表格、陰影、邊界、留白、框線、多欄位排版、2D/3D變形處理、媒體查詢等屬性。
‧CSS 3的Box Model與定位方式。
‧JavaScript的核心語法和JavaScript在瀏覽器端的應用,讓靜態網頁具有動態效果,包括DOM、JavaScript內建的物件、事件處理等。
‧使用jQuery Mobile建立行動網頁的介面,將跨平台、跨裝置所面臨的相容性問題交給jQuery Mobile處理。

‧使用PhoneGap Build雲端服務,將行動網站轉換成像Native App一樣安裝在行動裝置上、無需透過瀏覽器執行、跨平台、跨裝置的Hybrid App。

想要看懂網頁內夾雜的HTML和CSS原始碼?想要知道HTML 5和CSS 3有何酷炫的新功能? 想要精準掌控網頁的樣式設計、定位方式與版面配置?想要根據PC與行動裝置的特徵設計不同的樣式?
想要快速打造行動網頁的介面?
想要不用學會Java、Objective-C就開發出跨平台的行動裝置App?
如果您正有這些疑問,那麼本書將提供您最佳的解答!


  • Part1 HTML(第1頁)
    • 第1章 HTML 簡介(第1-1頁)
    • 第2章 文件結構(第2-1頁)
    • 第3章 資料編輯與格式化(第3-1頁)
    • 第4章 超連結與圖片(第4-1頁)
    • 第5章 表格(第5-1頁)
    • 第6章 影音多媒體(第6-1頁)
    • 第7章 表單與後端處理(第7-1頁)
  • Part2 CSS(第2頁)
    • 第8章 CSS簡介(第8-1頁)
    • 第9章 字型、文字與清單屬性(第9-1頁)
    • 第10章 色彩、背景、漸層與表格屬性(第10-1頁)
    • 第11章 Box Model 與定位方式(第11-1頁)
    • 第12章 特殊效果與媒體查詢(第12-1頁)
  • Part3 JavaScript(第3頁)
    • 第13章 型別、變數與運算子(第13-1頁)
    • 第14章 流程控制(第14-1頁)
    • 第15章 函式與陣列(第15-1頁)
    • 第16章 物件、DOM 物件、DOM(第16-1頁)
  • Part4 jQuery Mobile(第4頁)
    • 第17章 使用 jQuery Mobile(第17-1頁)
    • 第18章 jQuery Mobile UI 元件(第18-1頁)
    • 第19章 jQuery Mobile API(第19-1頁)
    • 第20章 將行動網站轉換成App(第20-1頁)
  • 附錄A HTML 框架元素 (PDF 電子書)(第A-1頁)
    • A-1 建立框架- 、、 元素(第A-2頁)</li><li>A-2 包含水平框架與垂直框架的網頁(第A-17頁)</li><li>A-3 製作導覽列(第A-20頁)</li></ul></li> <div id="jumpChapter" class="collapse fade"> </div> <div class="more_wrap"> <button type="button" class="btn btn-light moreBtn collapsed" data-toggle="collapse" data-target="#jumpChapter"><i class="icon icon-arrow-top-01"></i></button> </div> </ul> </div> </div> </div> </div> </div> </div> </div> <!-- [E] 簡介、章節、作者簡介 Tab --> <!-- End 中間欄位區塊 --> <!-- 右側欄位區塊 --> <div class="col-sm-5 col-md-4 col-lg-3 d-none d-sm-block"> <div class="right_side_info ml-md-0 ml-xl-4"> <div class="card border-0 bg-light mb-3"> <div class="card-body"> <div class="card-text book_price_group"> <div class="book_paper_price">紙本書 NT$ 540</div> <div class="text1 bold">單本電子書</div> <div class="book_price"> <span class="text2 ft-azure bold h5">NT$</span> <span class="price ft-azure bold h5">378</span> <span class="coin ft-azure small"> </span> </div> </div> <!--直接購買--> <div class="card-text"> <button type="button" id="buynow" class="btn btn-lg btn-outline-primary custom_blue_outline_style btn-block" brn="45305" onclick="detailPageAddSpCart(true, this)"> <i class="icon icon-indicator"></i>直接購買 </button> </div> <!--放入購物車--> <div class="card-text"> <button type="button" id="addtocart" class="btn btn-lg btn-primary btn-block custom_blue_outline_style " brn="45305" onclick="detailPageAddSpCart(false, this)"> <i class="icon icon-indicator-add"></i>放入購物車 </button> </div> <!--買書送人--> <hr> <div class="card-text"> <button type="button" id="buyasgift" class="btn btn-lg btn-outline-primary custom_deep_seablue_outline_style btn-block" brn="45305" onclick="detailPageAddSpCart(true, this)">買書送人</button> </div> </div> </div> <!--右邊套書按鈕--> <!--右邊活動--> <!-- <div class="book_promo_info mb-3"> <span class="badge badge-pill badge-danger mr-0 mb-2 mb-lg-2 px-2 promo_info_text d-block">20周年慶/最HOT新書三本75折</span> <span class="badge badge-pill badge-danger mr-0 mb-2 mb-lg-2 px-2 promo_info_text d-block">HyRead選書~任選2本,現折30元!</span> </div> --> <!--右邊神秘的作家專欄--> <!-- <div class="writer_column card bg-light"> <div class="card-body"> <div class="card-text book-badge"> <span class="badge badge-dark ">作家專欄</span> </div> <div class="card-text ft-azure bold">看見你所聽的,聽見你所想的──五月選書《蜜蜂與遠雷》 </div> <div class="card-text ps_note_text"> 文/林小滿 2018年05月03日 </div> <div class="card-text small-sm"> 蜜蜂與遠雷 每個人選擇讀/不讀某一本書的原因有很多,但「不懂音樂」絕對不足以成為放下《蜜蜂與遠雷》的理由──它並非 <a href="javascript:;" class="ft-azure">more</a> </div> </div> </div> --> </div> </div> <!-- End 右側欄位區塊 --> <!-- [S] GOOGLE結構化資料 書本商品資訊 --> <script type="application/ld+json"> { "@context": "https://schema.org/", "@type": "Product", "name": "跨裝置網頁設計:HTML 5、CSS 3、JavaScript、jQuery Mobile快速建立電腦&行動網站", "image": "https://webcdn2.ebook.hyread.com.tw/bookcover/45305978986347021220142704110304.jpg", "releasedate": "2013[民102]", "description": "內容簡介 ‧HTML 5元素和各種表單輸入類型,包括表單的後端處理。‧CSS 3的字型、文字、清單、色彩、背景、漸層、表格、陰影、邊界、留白、框線、多欄位排版、2D/3D變形處理、媒體查詢等屬性。‧CSS 3的Box Model與定位方式。‧JavaScript的核心語法和JavaScript在瀏覽器端的應用,讓靜態網頁具有動態效果,包括DOM、JavaScript內建的物件、事件處理等。‧使用jQuery Mobile建立行動網頁的介面,將跨平台、跨裝置所面臨的相容性問題交給jQuery Mobile處理。", "sku": "978-986-347-021-2 ; 986-347-021-X", "gtin13": "978-986-347-021-2 ; 986-347-021-X", "brand": "碁峰資訊", "offers": { "@type": "Offer", "url": "https://ebook.hyread.com.tw/bookDetail.jsp?id=45305", "priceCurrency": "TWD", "price": "378", "availability": "https://schema.org/InStock", "seller": { "@type": "Organization", "name": "HyRead ebook" } } } </script> <!-- [E] GOOGLE結構化資料 書本商品資訊 --> </div> </div> </div> </section> <style> a.anchor { display: block; position: relative; top: -120px; visibility: hidden; } </style> <a class="anchor" id="cpSetOfBook"></a> <!-- 同分類推薦書 --> <section class=""> <div class="container-fluid free_book pb-5"> <div class="container-1280"> <div class="titleBar py-3 py-md-4 d-flex justify-content-between"> <div class="blkTitle h5">同分類熱門書</div> </div> </div> <div class="container-1320"> <div class="row"> <div class="swiper-container" data-inner-slider> <div class="swiper-wrapper"> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="70219"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=70219" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/70219978986347584220152418040540.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>PDF</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=70219">網頁程式設計HTML5.JavaScript.CSS.XHTML.Ajax</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="76122"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=76122" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/76122978986347733420150021020906.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>PDF</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=76122">手機應用程式設計超簡單:App Inventor 2 零基礎入門班</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="50145"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=50145" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/50145978986571403120145016030546.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>PDF</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=50145">Adobe Certified Associate(ACA)國際認證:Adobe Photoshop CS6視覺設計與影像合成處理</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="15977"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=15977" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/15977978957215720620133003110110.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>PDF</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=15977">感測器原理與應用</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="195464"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=195464" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/195464978986235787320191128041110.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>EPUB</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=195464">[全圖解]寫給所有人的運算思維入門:5堂基礎課程+演算法練習, 邊做邊學, 建構邏輯思考、培養程式設計核心能力的原理和應用</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="74573"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=74573" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/74573978988139533720151430030734.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>PDF</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=74573">Apple watch 實用天書:超過30 項強大功能圖文解說</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="54761"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=54761" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/54761978986568701420141307040856.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>PDF</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=54761">開發Android App使用VB輕鬆學</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="98217"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=98217" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/98217978986476103620161726100818.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>PDF</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=98217">跟我學Excel VBA:從入門變高手</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="40010"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=40010" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/40010978988124138220135311111244.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>PDF</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=40010">iPad Air.mini 2 玩樂寶典</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="119621"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=119621" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/119621978986476399320175207090756.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>PDF</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=119621">Access 2016資料庫系統概論與實務:適用2016/2013</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="45436"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=45436" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/4543620145506030330.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>PDF</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=45436">Fun心學2014電腦故障排除技巧</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="66812"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=66812" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/66812978986375151920154716020300.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>PDF</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=66812">互動式網站程式設計:ASP.NET 4.5使用Visual C# 2013</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="76527"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=76527" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/76527978986375149620154508100903.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>PDF</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=76527">網站與資料庫程式開發解析:Java SE8+JSP+SQL Server 2014</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="78028"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=78028" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/78028978986575173920154808081021.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>PDF</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=78028">Dropbox 不用整理的檔案整理術. 2, 別花時間搞整齊, 60個自動化技巧改變辦公室與生活效率</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="163632"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=163632" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/163632978986379680020181621051240.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>JPG</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=163632">不需要Hadoop:用Excel+VB更高竿玩轉大數據</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="14004"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=14004" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/14004978986868230620130621010512.JPG" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>JPG</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=14004">粗糙集理論基本解析及Matlab GUI工具箱</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="100680"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=100680" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/100680978986434120720162120091025.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>PDF</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=100680">Android高效入門 深度學習:使用Android Studio 2開發Android 6.0 APP</a></div> </div> </div> <div class="swiper-slide"> <div class="book-wrap"> <div class="book-cover shadow-02 mb-2"> <div class="book-overlay"> <div class="book-shopcar"> <a href="javascript:;" class="btn buyBtn d-none d-lg-inline-block shopCartBtn" brn="76222"> <i class="icon icon-add_shopping_cart"></i>購物車 </a> </div> <a href="/bookDetail.jsp?id=76222" class="book-link"> <div class="coverBox"> <div class="maskColor"><img src="Template/store/images/book_overlay_250.png" class="img-fluid maskPic" on-image-load></div> <img src="https://webcdn2.ebook.hyread.com.tw/bookcover/76222978986347616020152316020913.jpg" class="img-fluid bookPic chmln__img" on-image-load> </div> </a> </div> <!--加入最愛(未登入)--> <div class="no_login_favorite"></div> <div class="ver-btngroup "> <span class="btn btn-dark"><small>PDF</small></span> </div> </div> <div class="book-title-01"><a href="/bookDetail.jsp?id=76222">Photoshop設計不設限</a></div> </div> </div> </div> <!-- Add Arrows --> <button class="swiper-button-next"></button> <button class="swiper-button-prev"></button> </div> </div> </div> </div> </section> <!-- End 為您推薦 --> </div> </div> </div> <!-- APP Promo Banner --> <div class="row container-fluid bg-light border-top no-gutters align-items-center py-4"> <div class="col col-md-12 col-lg-3 ml-3 ml-xl-auto appPromoSlogon"> <a href="https://goo.gl/myZzoD" target="_blank" class="py-3" title="還沒安裝 HyRead 3 嗎?馬上免費安裝~"> <img src="/Template/store/images/footer-logo-pc.png" class="footer_logo img-fluid py-3" alt="HyRead"> <span class="rightnow d-block d-sm-inline-block text-dark">還沒安裝 HyRead 3 嗎?馬上免費安裝~</span> </a> </div> <div class="col col-md col-lg-auto mr-1 mr-xl-auto appPromoStoreLink justify-content-sm-center d-none d-md-block"> <a href="https://goo.gl/1ZkUJb" target="_blank" class="p-1"><img src="/Template/store/images/appstore.svg" class="img-fluid" alt="App Store"></a> <a href="https://goo.gl/WNmstc" target="_blank" class="p-1"><img src="/Template/store/images/googleplay.svg" class="img-fluid" alt="Google Play"></a> <a href="https://goo.gl/kGEflg" target="_blank" class="p-1"><img src="/Template/store/images/windowsstore.svg" class="img-fluid" alt="Windows Store"></a> <a href="javascript:;" class="p-1" data-toggle="modal" data-target="#pcdownloadModal"><img src="/Template/store/images/pc.svg" class="img-fluid" alt="pc download"></a> </div> <div class="col col-lg-1 mr-xl-auto d-none d-xl-block"><img src="/Template/store/images/app_qrcode.svg" class="img-fluid qr_code " alt="QR Code"></div> </div> <!-- APP Promo Banner --> <!--========== FOOTER ==========--> <footer class="footer"> <!-- PC/Mobile sitemap footer --> <div class="container-fluid"> <div class="container-1280 px-md-3 mx-xl-auto" id="pcMobileFooter"> <div class="row no-gutters"> <!-- PC sitemap --> <ul class="col footer_link_list d-none d-lg-block"> <li class="title">關於HyRead</li> <!--熱門活動--> <!-- <li><a href="javascript:;" class="footer_link" title="熱門活動">熱門活動</a></li> --> <li><a href="/Template/store/serviceRule.html" target="_blank" class="footer_link" title="服務政策">服務政策</a></li> <li><a href="/Template/store/privacy.html" target="_blank" class="footer_link" title="隱私權政策">隱私權政策</a></li> <li><a href="https://ebook.hyread.com.tw/activity/directions/index-2.html" target="_blank" class="footer_link" title="序號兌換說明">序號兌換說明</a></li> </ul> <ul class="col footer_link_list d-none d-lg-block"> <li class="title">會員服務</li> <li><a href="javascript:;" class="footer_link" title="免費註冊" data-toggle="modal" data-target="#registerMemberModal">免費註冊</a></li> <li><a href="javascript:;" class="footer_link" title="忘記密碼" data-toggle="modal" data-target="#forgotPasswordModal">忘記密碼</a></li> <li><a href="https://hyweb.zendesk.com/hc/zh-tw/categories/200041446" target="_blank" class="footer_link" title="常見問題">常見問題</a></li> </ul> <ul class="col footer_link_list d-none d-lg-block"> <li class="title">合作提案</li> <li><a href="https://ebook.hyread.com.tw/activity/cooperation.html" target="_blank" class="footer_link" title="出版社合作">出版社合作</a></li> <li><a href="http://hyweb.ebook.hyread.com.tw/resource/features.html" target="_blank" class="footer_link" title="團體採購優惠">團體採購優惠</a></li> </ul> <ul class="col footer_link_list"> <li class="title">聯絡客服</li> <li><span class="plain_text">客服時間:週一~五9:00~18:30</span></li> <li><span class="plain_text">客服專線:02-2395-6966*2555</span></li> <li><span class="plain_text"><a href="mailto:service@hyread.com.tw">Email:service@hyread.com.tw</a></span></li> <li><span class="plain_text">100台北市中正區重慶南路二段51號5樓(台北分公司)</span></li> </ul> <!-- PC sitemap --> <!-- Mobile sitemap --> <div class="container-fluid d-block d-lg-none" id="MobileSiteMap"> <ul class="footer_link_list d-block d-lg-none mb-0 d-flex align-content-start flex-wrap"> <li class="col-4 px-0"><a href="/Template/store/serviceRule.html" target="_blank" class="footer_link" title="服務政策">服務政策</a></li> <li class="col-4 px-0"><a href="/Template/store/privacy.html" target="_blank" class="footer_link" title="隱私權政策">隱私權政策</a></li> <li class="col-4 px-0"><a href="https://ebook.hyread.com.tw/activity/directions/index-2.html" target="_blank" class="footer_link" title="序號兌換說明">序號兌換說明</a></li> <!--熱門活動--> <!-- <li class="col-4 px-0"><a href="javascript:;" class="footer_link" title="熱門活動">熱門活動</a></li> --> </ul> <div class="collapse" id="mobileFooterSitemap"> <ul class="footer_link_list d-block d-lg-none d-flex align-content-start flex-wrap"> <li class="col-4 px-0"><a href="javascript:;" class="footer_link" title="免費註冊" data-toggle="modal" data-target="#registerMemberModal">免費註冊</a></li> <li class="col-4 px-0"><a href="javascript:;" class="footer_link" title="忘記密碼" data-toggle="modal" data-target="#forgotPasswordModal">忘記密碼</a></li> <li class="col-4 px-0"><a href="https://hyweb.zendesk.com/hc/zh-tw/categories/200041446" target="_blank" class="footer_link" title="常見問題">常見問題</a></li> <li class="col-4 px-0"><a href="https://ebook.hyread.com.tw/activity/cooperation.html" target="_blank" class="footer_link" title="出版社合作">出版社合作</a></li> <li class="col-4 px-0"><a href="http://hyweb.ebook.hyread.com.tw/resource/features.html" target="_blank" class="footer_link" title="團體採購優惠">團體採購優惠</a></li> </ul> </div> <div class="justify-content-center text-center"> <a href="#mobileFooterSitemap" data-toggle="collapse" class="btn mobileFooterSitemapBtn"> <i class="footer_sitemap_open icon-arrow-down-01 pr-2" aria-hidden="true"></i> <i class="footer_sitemap_close icon-arrow-top-01 pr-2" aria-hidden="true" style="display:none"></i> </a> </div> </div> <!-- Mobile sitemap --> <div class="w-100 d-flex d-lg-none sep_line"></div> <!-- PC/Mobile social btn --> <ul class="col footer_link_list rounded-btn text-center text-lg-left my-1 social_btn_group"> <li class="title d-none d-lg-flex text-center text-lg-left">社群動態</li> <li class="mt-2 mt-lg-2 text-center text-lg-left"> <a href="https://www.facebook.com/hyread.ebook" target="_blank" class="footer_link mr-2 mr-xl-3" title="Facebook"><i class="icon-facebook pr-2" aria-hidden="true"></i></a> <a href="https://www.youtube.com/channel/UC_nWrFmNhashbV8hi8EUqtw" target="_blank" class="footer_link mr-2 mr-xl-3" title="Youtube"><i class="icon-youtube pr-2" aria-hidden="true"></i></a> <a href="https://line.me/R/ti/p/%40zrv5224k" target="_blank" class="footer_link mr-0 mr-xl-3" title="Line"><i class="icon-line-square pr-2" aria-hidden="true"></i></a> </li> </ul> <!-- PC/Mobile social btn --> <div class="w-100 d-flex d-lg-none"></div> <!-- Mobile lang/coin menu btn --> <div class="col d-block d-lg-none text-center text-lg-right py-4 py-lg-0"> <div class="dropdown"> <a href="javascript:;" class="langDropdownMenu btnStyle" data-toggle="modal" data-target="#langcoinMenuModal"><span class=""><i class="fa fa-globe pr-2" aria-hidden="true"></i>正體中文</span><span class="px-1">|</span><span class="">NT$ TWD</span></a> </div> </div> <!-- Mobile lang/coin menu btn --> <!-- PC go to top btn --> <a href="javascript:topFunction();" class="js-back-to-top d-none d-lg-block"><i class=" icon-chevron-with-circle-up" aria-hidden="true"></i></a> <!-- PC go to top btn --> </div> </div> </div> <!-- PC/Mobile sitemap footer --> <!-- PC footer credit & lang/coin menu --> <div class="container-fluid"> <div class="container-1280 mx-xl-auto" id="pcFooterCredit"> <div class="row py-4 align-items-center"> <div class="col-12 col-lg-8 py-2 text-center text-lg-left"> 凌網科技股份有限公司<br class="d-block d-lg-none">Copyright&copy; 2019 hyread <em > IP=3.230.119.106(71) </em> </div> </div> </div> </div> <!-- PC footer credit & lang/coin menu --> </footer> <!-- Google Tag Manager --> <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-TVTP73V');</script> <!-- End Google Tag Manager --> <!-- Google Tag Manager (noscript) --> <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-TVTP73V" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript> <!-- End Google Tag Manager (noscript) --> <!--========== END FOOTER ==========--> <script> $().ready(function(){ var rdurl = 'https://ebook.hyread.com.tw/bookDetail.jsp?id=45305'; var isExistPara = true; $('#mobileForm1 input[type=radio][name=lang]').change(function() { //location.href='/index.jsp?webpacLang='+$('input[type=radio][name=lang]:checked','#mobileForm1').val(); if(isExistPara){ rdurl += "&"; }else{ rdurl += "?"; } rdurl += "webpacLang=" + $('input[type=radio][name=lang]:checked','#mobileForm1').val(); location.href = rdurl; }); $('#mobileForm2 input[type=radio][name=coin]').change(function() { $.ajax({ url: '/Template/store/ajax/setCookie.jsp', type: 'GET', async: false, cache: false, data: { coin: $('input[type=radio][name=coin]:checked','#mobileForm2').val() }, error: function(xhr) { alert('Ajax request 發生錯誤'); }, success: function(data) { },complete : function () { location.reload(); } }); }); }) </script> <!-- language/coin Modal --> <div class="modal fade" id="langcoinMenuModal" tabindex="-1" role="dialog" aria-labelledby="langcoinMenuModal" aria-hidden="true"> <div class="modal-dialog modal-dialog-centered" role="document"> <div class="modal-content"> <div class="dropdown-menu langcoin_style shadow show lightbox_style"> <!-- 更換語言/幣別 表單 --> <h6 class="dropdown-header px-3 text-center">更換語言/幣別</h6> <div class="dropdown-divider"></div> <form id='mobileForm1' class="px-1 py-1"> <div class="container-fluid lang-selector"> <div class="row"> <div class="col-12"> <input type="text" readonly class="form-control-plaintext" id="staticText" value="選擇語言:"> </div> <div class="col-6 form-radio py-1"> <div class="custom-control custom-radio"> <input type="radio" name="lang" value="zh_TW" class="custom-control-input" name="langSelectorModal" id="langSelectorModal1" checked=''> <label class="custom-control-label" for="langSelectorModal1"> 正體中文</label> </div> </div> <div class="col-6 form-radio py-1"> <div class="custom-control custom-radio"> <input type="radio" name="lang" value="zh_CN" class="custom-control-input" name="langSelectorModal" id="langSelectorModal2"> <label class="custom-control-label" for="langSelectorModal2">簡體中文 </label> </div> </div> <div class="col-6 form-radio py-1"> <div class="custom-control custom-radio"> <input type="radio" name="lang" value="en_US" class="custom-control-input" name="langSelectorModal" id="langSelectorModal3"> <label class="custom-control-label" for="langSelectorModal3">English</label> </div> </div> <div class="col-6 form-radio py-1"> <div class="custom-control custom-radio"> <input type="radio" name="lang" value="ja_JP" class="custom-control-input" name="langSelectorModal" id="langSelectorModal4"> <label class="custom-control-label" for="langSelectorModal4"> 日本語</label> </div> </div> <!-- <div class="col-6 form-radio py-1"> <div class="custom-control custom-radio"> <input type="radio" name="lang" value="in_ID" class="custom-control-input" name="langSelectorModal" id="langSelectorModal5"> <label class="custom-control-label" for="langSelectorModal5">Indonesia</label> </div> </div> <div class="col-6 form-radio py-1"> <div class="custom-control custom-radio"> <input type="radio" name="lang" value="ms_MY" class="custom-control-input" name="langSelectorModal" id="langSelectorModal6"> <label class="custom-control-label" for="langSelectorModal6">Malay</label> </div> </div> --> </div> </div> </form> <div class="dropdown-divider"></div> <form id="mobileForm2" class="px-1 py-1"> <div class="container-fluid coin-selector"> <div class="row"> <div class="col-12"> <input type="text" readonly class="form-control-plaintext" id="staticText" value="選擇幣別:"> </div> <div class="col-6 form-radio py-1"> <div class="custom-control custom-radio"> <input type="radio" name="coin" value="TWD" class="custom-control-input" name="coinSelectorModal" id="coinSelectorModal1" checked> <label class="custom-control-label" for="coinSelectorModal1">TWD(NT$)</label> </div> </div> <div class="col-6 form-radio py-1"> <div class="custom-control custom-radio"> <input type="radio" name="coin" value="HKD" class="custom-control-input" name="coinSelectorModal" id="coinSelectorModal2"> <label class="custom-control-label" for="coinSelectorModal2">HKD(HK$)</label> </div> </div> <div class="col-6 form-radio py-1"> <div class="custom-control custom-radio"> <input type="radio" name="coin" value="USD" class="custom-control-input" name="coinSelectorModal" id="coinSelectorModal3"> <label class="custom-control-label" for="coinSelectorModal3">USD($)</label> </div> </div> <div class="col-6 form-radio py-1"> <div class="custom-control custom-radio"> <input type="radio" name="coin" value="CNY" class="custom-control-input" name="coinSelectorModal" id="coinSelectorModal4"> <label class="custom-control-label" for="coinSelectorModal4">CNY(¥)</label> </div> </div> <div class="col-6 form-radio py-1"> <div class="custom-control custom-radio"> <input type="radio" name="coin" value="JPY" class="custom-control-input" name="coinSelectorModal" id="coinSelectorModal5"> <label class="custom-control-label" for="coinSelectorModal5">JPY(¥)</label> </div> </div> <div class="col-6 form-radio py-1"> <div class="custom-control custom-radio"> <input type="radio" name="coin" value="THB" class="custom-control-input" name="coinSelectorModal" id="coinSelectorModal6"> <label class="custom-control-label" for="coinSelectorModal6">THB(฿)</label> </div> </div> </div> </div> </form> <!-- 更換語言/幣別 表單 --> </div> </div> </div> </div> <!-- language/coin Modal --> <!-- Mobile side navbar menu --> <nav id="mobileSideMenu"> <ul> <li> <a href="javascript:;" data-toggle="modal" data-target="#langcoinMenuModal">更換語言/幣別</a> </li> <li> <a href="/Template/store/shoppingcart/point/buyPoint.jsp">還沒有點數嗎?<span class="ft-yellow">立即儲值</span><br/> 就送你紅利點數,最高500點。</a> </li> <li><span>電子書</span> <ul> <li><a href="/searchList.jsp?search_field=BSU&search_input=B*&theme=&sortinfo=&op=AND&search_field=BSU&search_input=B0208">科幻奇幻小說</a></li><li><a href="/searchList.jsp?pagesize=30&sortinfo=YEAR,1&search_field=BSU&search_input=B*&theme=文學&op=AND&search_field=BSU&search_input=B0104&theme=文學&pagesize=30&sortinfo=&viewtype=2">翻譯文學誌</a></li><li><a href="/searchList.jsp?search_input=收納&search_field=FullText&op=OR&search_input=整理術&search_field=FullText&op=OR&search_input=不整理&search_field=FullText">收納整理術</a></li><li><a href="/searchList.jsp?pagesize=30&sortinfo=YEAR,1&search_field=BSU&search_input=J0106*&theme=&op=AND&search_field=BSU&search_input=J0106&theme=&sortinfo=">寫真圖文書</a></li><li><a href="/searchList.jsp?search_input=囤積&search_field=FullText&op=OR&search_input=零雜物&search_field=FullText&op=OR&search_input=簡單生活&search_field=FullText&op=OR&search_input=簡樸生活&search_field=FullText">簡單零雜物</a></li><li><a href="/searchList.jsp?pagesize=30&sortinfo=YEAR,1&search_field=BSU&search_input=J0211*&theme=&sortinfo=">眼睛流口水</a></li><li><a href="/searchList.jsp?pagesize=30&sortinfo=YEAR,1&search_field=BSU&search_input=D0101*&theme=國際市場趨勢&pagesize=30&sortinfo=&viewtype=2">掌握趨勢者</a></li><li><a href="/searchList.jsp?pagesize=30&sortinfo=YEAR,1&search_field=BSU&search_input=D0103*&theme=&sortinfo=">賺錢要做功課</a></li><li><a href="/searchList.jsp?nowpage=1&pagesize=30&search_field=BSU&search_input=O0102*&theme=&sortinfo=">日本漫畫本</a></li><li><a href="/Template/store/freeBooks.jsp">免費領書</a></li><li><a href="http://ebook.hyread.com.tw/searchList.jsp?search_field=BSU&search_input=V*">嗨讀影音區</a></li><li><a href="/Template/store/eventPage.jsp?id=441">9月新書優惠</a></li><li><a href="/Template/store/eventPage.jsp?id=442">9月發燒精選</a></li> <li><a href="/Template/store/category_list.jsp">瀏覽電子書所有分類</a></li> </ul> </li> <li><span>雜誌</span> <ul> <li><a href="/Template/store/magazineList.jsp?cate=M02">財經商管</a></li><li><a href="/Template/store/magazineList.jsp?cate=M01">新聞新知</a></li><li><a href="/Template/store/magazineList.jsp?cate=M03">數位資訊</a></li><li><a href="/Template/store/magazineList.jsp?cate=M04">語言學習</a></li><li><a href="/Template/store/magazineList.jsp?cate=M05">親子教育</a></li><li><a href="/Template/store/magazineList.jsp?cate=M06">生活居家</a></li><li><a href="/Template/store/magazineList.jsp?cate=M07">旅遊行腳</a></li><li><a href="/Template/store/magazineList.jsp?cate=M08">時尚風格</a></li><li><a href="/Template/store/magazineList.jsp?cate=M09">影視娛樂</a></li><li><a href="/Template/store/magazineList.jsp?cate=M10">知識專業</a></li><li><a href="/Template/store/magazineList.jsp?cate=M11">人文藝術</a></li><li><a href="/Template/store/magazineList.jsp?cate=M12">休閒運動</a></li> </ul> </li> <li><span>即時排行</span> <ul> <li><a href="/Template/store/bestSelling.jsp">暢銷排行</a></li> <li><a href="/Template/store/rentalRating.jsp">租書排行</a></li> <li><a href="/Template/store/magazineRating.jsp">雜誌排行</a></li> <li><a href="/Template/store/trialRating.jsp">試閱排行</a></li> </ul> </li> <!-- 最新上架 --> <li><span>最新上架</span> <ul> <li><a href="/Template/store/newbooks.jsp">熱門新書</a></li> <li><a href="/Template/store/magazineList.jsp">新刊上架</a></li> </ul> </li> <!-- 精選文章 --> <li><a href="/Template/store/bestArticle.jsp">精選文章</a></li> <!-- [S] 熱門活動 --> <!-- <li><span>熱門活動</span> <ul> <li><a href="/Template/store/eventPage.jsp?id=442">9月發燒精選</a></li> <li><a href="/Template/store/eventPage.jsp?id=257">職場停看聽</a></li> <li><a href="/Template/store/eventPage.jsp?id=448">老師是戀愛導師?</a></li> <li><a href="/Template/store/eventPage.jsp?id=263">謊言追追追</a></li> <li><a href="/Template/store/eventPage.jsp?id=450">《銘印之子》推薦好書</a></li> <li><a href="/Template/store/eventPage.jsp?id=199">輕鬆「聽」學英文!</a></li> <li><a href="/Template/store/eventPage.jsp?id=446">笭菁恐怖小說展</a></li> <li><a href="/Template/store/eventPage.jsp?id=345">致那些曾有過的傷痛與美好</a></li> <li><a href="/Template/store/eventPage.jsp?id=449">蝴蝶Seba輕小說展</a></li> <li><a href="/Template/store/eventPage.jsp?id=281">幸福好滋味</a></li> </ul> </li> --> <!-- [E] 熱門活動 --> <li><a href="/Template/store/event_list.jsp">熱門活動</a></li> <li><a href="/Template/store/publishing.jsp">出版社推薦</a></li> <li><a href="/Template/store/article.jsp">小編文摘</a></li> <li><a href="https://ebook.hyread.com.tw/activity/201902gaze/index.html">Gaze閱讀器</a></li> <li><a href="/Template/store/freeBooks.jsp">免費好書</a></li> <li><a href="javascript:alertLogin();">兌換專區</a></li> </ul> </nav> <!-- Mobile side navbar menu --> <!-- 使用HyRead帳號登入 Modal --> <div class="modal fade hyread_type frame_login" id="loginModal" tabindex="-1" role="dialog" aria-labelledby="loginModal" aria-hidden="true"> <div class="modal-dialog modal-dialog-centered" role="document"> <div class="modal-content p-2 p-md-4"> <div class="modal-header text-center pt-2 pb-0 py-md-0"> <div class="container-fluid"> <div class="row"> <div class="col px-0"> <img src="/Template/store/images/hyread-logo-no-text.png" class="img-fluid" alt="Small Logo"></div> <div class="col-9 col-md-9 pl-0 pl-md-5 pr-0 align-self-center"> <h5 class="modal-title">使用HyRead帳號登入</h5> </div> <div class="col-1 col-md-2 align-self-center"> <button type="button" class="close px-0" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> </div> </div> </div> <hr class="mb-0 d-block d-md-none"/> <div class="modal-body pb-3 pb-md-5"> <div class="container-fluid"> <div class="row d-block"> <form name="loginForm" action="/SSO/storeLogin.jsp" method="post"> <input type="hidden" name="loginmethod" value="hyread"> <div class="anim_form_control mt-4"> <input type="text" id="inputName" name="account2" required> <span class="highlight"></span> <span class="bar"></span> <label for="inputName">請輸入帳號</label> </div> <div class="anim_form_control mt-4"> <input type="password" id="inputPassword" name="passwd2" required> <span class="highlight"></span> <span class="bar"></span> <label for="inputPassword">請輸入密碼</label> </div> </form> </div> <div class="row mt-4"> <button type="button" data-dismiss="modal" class="btn btn-primary custom_blue_solid_style w-100 py-2" onclick="login();" >登入</button> </div> <div class="row mt-3"> <div class="col px-0 suggest_login"> 還沒有帳號? <br class="d-inline d-md-none"/> <a href='javascript:;' data-toggle="modal" data-target="#registerMemberModal" class="ft-deepseablue" data-dismiss="modal" title="立即免費註冊">立即免費註冊</a> </div> <div class="col-4 col-md-3 px-0 text-right forgot_password"> <a href='javascript:;' data-toggle="modal" data-target="#forgotPasswordModal" class="ft-warm-grey" data-dismiss="modal" title="忘記密碼">忘記密碼</a> </div> </div> </div> </div> <div class="modal-footer pb-5"> <div class="row justify-content-between no-gutters w-100"> <div class="col-12 pb-2"> <div class="stroke_line_text"><span>連結現有帳號登入</span></div> </div> <div class="w-100 pt-3"></div> <div class="col-12 col-md-6 pr-md-1 pt-2"> <button type="button" onclick="GoFacebook();" data-dismiss="modal" class="btn btn-primary custom_facebook_solid_style w-100 py-2"><i class="icon-facebook mr-2"></i>Facebook</button> </div> <div class="col-12 col-md-6 pl-md-1 pt-2"> <button type="button" onclick="GoGmail();" data-dismiss="modal" class="btn btn-danger custom_googleplus_solid_style w-100 py-2"><i class="icon-google mr-2"></i>Google</button> </div> <div class="col-12 col-md-6 pr-md-1 pt-2"> <button type="button" onclick="GoAppleId();" data-dismiss="modal" class="btn btn-dark ft-white w-100 py-2"> <i class="icon icon-appleinc mr-2"></i>Apple ID </button> </div> <div class="col-12 col-md-6 pl-md-1 pt-2"> <button type="button" onclick="" data-toggle="modal" data-target="#loginOpenIDModal" data-dismiss="modal" class="btn btn-warning custom_openid_solid_style ft-white w-100 py-2"> <i class="icon icon-openid mr-2"></i>Open ID </button> </div> <div class="row mt-3"> <div class="col px-3 ft-warm-grey login_note"> HyRead品牌整合,提供您更多服務!<br/>您可以使用HyRead journal全文資料庫會員帳號、密碼登入。 </div> </div> </div> </div> </div> </div> </div> <script> function login() { document.loginForm.submit(); } function GoFacebook(){ window.location = "http://www.facebook.com/dialog/oauth/?scope=email&client_id=241738632518448&redirect_uri=https://ebook.hyread.com.tw/SSO/FBAuth.jsp&response_type=token"; } function GoGmail(){ window.location = "https://accounts.google.com/o/oauth2/auth?response_type=token&scope=email&state=google&redirect_uri=https://ebook.hyread.com.tw/SSO/GmailAuth.jsp&client_id=30212826069-9n9dup3i54ha2luuj7bgho32bdj0amic.apps.googleusercontent.com&approval_prompt=auto&access_type=online"; } function GoAppleId(){ window.location = "https://ebook.hyread.com.tw/SSO/AppleAuth.jsp"; } function GoOpenID(){ form12.submit(); } </script> <!-- 使用HyRead帳號登入 Modal --> <!-- 註冊HyRead帳號 Modal --> <div class="modal fade hyread_type frame_register" id="registerMemberModal" tabindex="-1" role="dialog" aria-labelledby="registerMemberModal" aria-hidden="true"> <div class="modal-dialog modal-dialog-centered" role="document"> <div class="modal-content p-2 p-md-4"> <div class="modal-header text-center pt-2 pb-0 py-md-0"> <div class="container-fluid"> <div class="row"> <div class="col px-0"> <img src="/Template/store/images/hyread-logo-no-text.png" class="img-fluid" alt="Small Logo"></div> <div class="col-9 col-md-9 pl-0 pl-md-5 pr-0 align-self-center"> <h5 class="modal-title">註冊HyRead帳號</h5> </div> <div class="col-1 col-md-2 align-self-center"> <button type="button" class="close px-0" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> </div> </div> </div> <hr class="mb-0 d-block d-md-none"/> <div class="modal-body pb-3 pb-md-5"> <div class="container-fluid"> <div class="row d-block"> <form method="POST" id="regForm" action="javascript:;"> <div class="anim_form_control mt-4"> <input type="text" id="regAccount" name="regAccount" required> <span class="highlight"></span> <span class="bar"></span> <label for="regAccount">請輸入帳號 <span class="ft-grapefruit ml-3" id="accountChkInfo"></span></label>(<a href="javascript:chkAccountExist()">查看帳號是否被使用</a>) </div> <div class="anim_form_control mt-4"> <input type="text" id="regEmail" name="regEmail" required> <span class="highlight"></span> <span class="bar"></span> <label for="regEmail">請輸入電子信箱</label> </div> <div class="anim_form_control mt-4"> <input type="password" id="regPassword" name="regPassword" required> <span class="highlight"></span> <span class="bar"></span> <label for="regPassword">請輸入密碼</label> </div> <div class="anim_form_control mt-4"> <input type="password" id="regConfirmPassword" name="regConfirmPassword" required> <span class="highlight"></span> <span class="bar"></span> <label for="regConfirmPassword">請再輸入一次密碼</label> </div> <div class="anim_form_control mt-4 g-recaptcha" data-sitekey="6LeAGiAUAAAAAH9aFWeUdCn2rJQtUV-LbSJtIgCJ" data-callback="isNotRobot"></div> </form> </div> <div class="row mt-4"> <div class="form-group mb-3"> <div class="custom-control custom-checkbox"> <input type="checkbox" class="custom-control-input" id="register_rule_agree"> <label class="custom-control-label" for="register_rule_agree">我同意 <a href="/Template/store/serviceRule.html" target="_blank">服務條款</a> & <a href="/Template/store/privacy.html" target="_blank">隱私權條款</a></label> </div> </div> </div> <!-- <div class="row"> <div class="form-group mb-3"> <div class="custom-control custom-checkbox"> <input type="checkbox" class="custom-control-input" id="register_order_epaper"> <label class="custom-control-label" for="register_order_epaper">我要訂閱電子報,好康消息不漏接。</label> </div> </div> </div> --> <div class="row"> <button type="button" onclick="submitRegForm();" class="btn btn-primary custom_blue_solid_style w-100 py-2" >註冊</button> </div> <div class="row mt-4"> <div class="col px-0 suggest_login text-center"> 已有帳號了?<a href="javascript:;" data-dismiss="modal" data-toggle="modal" data-target="#loginModal" class="ft-deepseablue" title="馬上登入">馬上登入</a> </div> </div> </div> </div> <div class="modal-footer"></div> </div> </div> </div> <!-- 註冊HyRead帳號 Modal --> <script> var isValidRecaptcha = false; var isNotRobot = function() { isValidRecaptcha = true; }; function chkAccountExist(){ if (!$("input[name='regAccount']").val()) { alert('請填寫帳號!'); return false; } var account = $("input[name='regAccount']").val(); $.ajax({ url: '/Template/store/ajax/chkAccountExist.jsp', type: 'GET', async: false, cache: false, data: { account: account }, error: function(xhr) { alert('Ajax request 發生錯誤'); }, success: function(data) { var result = data.trim(); if(result == "true"){ //alert("此帳號已被申請"); $('#accountChkInfo').text("此帳號已被申請"); } else{ //alert("此帳號可以申請註冊"); $('#accountChkInfo').text("此帳號可以申請註冊"); } },complete : function () { //location.reload(); }, beforeSend:function(){ $('#accountChkInfo').text(""); //$('#exchangeZoneResult').empty(); //$('#exchangeZoneResult').append('<dd class="h5 bold my-4"></dd><br>'); } }); } function submitRegForm(){ var emailRegxp = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/; var accountRegExp = /^[\d|a-zA-Z]+$/; if(!isValidRecaptcha){ alert('請勾選我不是機器人!'); return false; } if (!$("input[name='regAccount']").val()) { alert('請填寫帳號!'); return false; } if (accountRegExp.test($("input[name='regAccount']").val()) == false){ alert('帳號只能為數字加英文的組合!'); return false; } if ($("input[name='regAccount']").val().length > 50) { alert('帳號請填入50個字元內,小寫或大寫英文字母(a~z,A~Z)、數字(0~9)'); return false; } if (!$("input[name='regEmail']").val()) { alert('請填寫email!'); return false; } if (emailRegxp.test($("input[name='regEmail']").val()) == false){ alert('請檢查email格式!'); return false; } if (!$("input[name='regPassword']").val()) { alert('請輸入密碼!'); return false; } if (!$("input[name='regConfirmPassword']").val()) { alert('請再次確認密碼!'); return false; } if($("input[name='regPassword']").val() != $("input[name='regConfirmPassword']").val()){ alert('兩次輸入的密碼不相同,請重新確認!'); return false; } if ($("input[name='regPassword']").val().length < 7 || $("input[name='regPassword']").val().length > 20) { alert('密碼請填入7至20個字元的小寫或大寫英文字母!'); return false; } if($('#register_rule_agree').is(":checked") == false){ alert('請同意服務條款 與 隱私權條款!'); return false; } $('#regForm').attr('action', '/Template/store/service/register_act.jsp'); $('#regForm').submit(); } </script> <!-- 忘記密碼 Modal --> <div class="modal fade hyread_type frame_forgotpassword" id="forgotPasswordModal" tabindex="-1" role="dialog" aria-labelledby="forgotPasswordModal" aria-hidden="true"> <div class="modal-dialog modal-dialog-centered" role="document"> <div class="modal-content p-2 p-md-4"> <div class="modal-header text-center pt-2 pb-0 py-md-0"> <div class="container-fluid"> <div class="row"> <div class="col px-0"> <img src="/Template/store/images/hyread-logo-no-text.png" class="img-fluid" alt="Small Logo"></div> <div class="col-9 col-md-9 pl-0 pl-md-5 pr-0 align-self-center"> <h5 class="modal-title">忘記密碼?</h5> </div> <div class="col-1 col-md-2 align-self-center"> <button type="button" class="close px-0" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> </div> </div> </div> <hr class="mb-0 d-block d-md-none"/> <div class="modal-body pb-3 pb-md-5"> <div class="container-fluid"> <div class="row mt-3"> <div class="col px-0 ft-warm-grey login_note"> 請輸入您註冊時的會員帳號及電子信箱,<br class="d-none d-md-block"/>我們會將您的帳號資訊E-mail給您 </div> </div> <div class="row d-block"> <form method="POST" id="forgetPwdForm" action="javascript:;"> <div class="anim_form_control mt-4"> <input type="text" id="inputAccount" name="FPwdAccount" required> <span class="highlight"></span> <span class="bar"></span> <label for="inputAccount">會員帳號</label> </div> <div class="anim_form_control mt-4"> <input type="email" id="inputEmail" name="FPwdEmail" required> <span class="highlight"></span> <span class="bar"></span> <label for="inputEmail">電子信箱</label> </div> </form> </div> <div class="row mt-4"> <div class="anim_form_control mt-4 g-recaptcha" data-sitekey="6LeAGiAUAAAAAH9aFWeUdCn2rJQtUV-LbSJtIgCJ" data-callback="isNotRobot"></div> </div> <div class="row mt-4"> <button type="button" onclick="submitFPwdForm();" class="btn btn-primary custom_blue_solid_style w-100 py-2">確認</button> </div> </div> </div> <div class="modal-footer"></div> </div> </div> </div> <!-- 忘記密碼 Modal --> <script> var isValidRecaptcha = false; var isNotRobot = function() { isValidRecaptcha = true; }; function submitFPwdForm(){ var emailRegxp = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/; if(!isValidRecaptcha){ alert('請勾選我不是機器人!'); return false; } if (!$("input[name='FPwdAccount']").val()) { alert('請填寫帳號!'); return false; } if (!$("input[name='FPwdEmail']").val()) { alert('請填寫email!'); return false; } if (emailRegxp.test($("input[name='FPwdEmail']").val()) == false){ alert('請檢查email格式!'); return false; } $('#forgetPwdForm').attr('action', '/Template/store/service/forgotPassword_act.jsp'); $('#forgetPwdForm').submit(); } </script> <!-- PC下載閱讀軟體安裝 Modal --> <div class="modal fade hyread_type frame_register_success" id="pcdownloadModal" tabindex="-1" role="dialog" aria-labelledby="pcdownloadModal" aria-hidden="true"> <div class="modal-dialog modal-dialog-centered" role="document"> <div class="modal-content p-2 p-md-4"> <div class="modal-header text-center pt-2 pb-0 py-md-0"> <div class="container-fluid"> <div class="row justify-content-end"> <div class="col-1 col-md-2 align-items-end"> <button type="button" class="close px-0" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> </div> </div> </div> <div class="modal-body pt-0 pb-3 pb-md-3"> <div class="container-fluid"> <form method="POST" id="downloadPcAppForm" action="javascript:;"> <div class="col text-center ft-greyish-brown shopping_page_complete_icon"> <span class="ft-greyish-brown mt-0 mt-md-3">PC下載閱讀軟體安裝</span> </div> <div class="row mt-3"> <div class="col px-0 ft-warm-grey login_note"> 版本編號:1.13.1216.0<br>更新日期:2020/01/10<br> <span class="text-danger small">※若PC Reader程式執行出現錯誤,請先執行更新windows update。</span> <ul><span class="font-weight-bold text-dark">環境需求參考</span> <li>主記憶體:512M,1GB更佳 <li>硬碟空間:500MB以上,3.5GB以上更佳(視下載書量預留空間)</li> <li>作業系統:Windows 10 / 8 / 7 / Vista / XP / 2000 /</li> <li>其它:.Net Framework 4以上版本 /<br>Windows XP需加裝適用於Windows XP 32位元的<a href="http://www.microsoft.com/zh-tw/download/windows-media-player-details.aspx">Windows Media Player</a></li> </ul> <ul><span class="font-weight-bold text-dark">版本自動升級</span> <li>安裝完成閱讀軟體後,當您每次開啓使用時,會自動進行版本升級,不需再重新安裝。</li> </ul> </div> </div> <div class="row mt-1"> <div class="col-12 mt-1 anim_form_control mt-4 g-recaptcha" data-sitekey="6LeAGiAUAAAAAH9aFWeUdCn2rJQtUV-LbSJtIgCJ" data-callback="isNotRobot"></div> <button type="button" onclick="submitDownloadPcAppForm();" class="btn btn-primary custom_blue_solid_style w-100 py-2 mt-3">確認下載</button> </div> </form> </div> </div> </div> </div> </div> <!-- PC下載閱讀軟體安裝 Modal --> <script> var isValidRecaptcha = false; var isNotRobot = function() { isValidRecaptcha = true; }; function submitDownloadPcAppForm(){ if(!isValidRecaptcha){ alert('請勾選我不是機器人!'); return false; } $('#downloadPcAppForm').attr('action', '/Template/store/service/downloadPcAppForm_act.jsp'); $('#downloadPcAppForm').submit(); } </script> <!-- OPEN ID Modal --> <div class="modal fade hyread_type frame_register" id="loginOpenIDModal" tabindex="-1" role="dialog" aria-labelledby="loginOpenIDModal" aria-hidden="true"> <div class="modal-dialog modal-dialog-centered" role="document"> <div class="modal-content p-2 p-md-4"> <div class="modal-header text-center pt-2 pb-0 py-md-0"> <div class="container-fluid"> <div class="row"> <div class="col px-0"> <img src="/Template/store/images/hyread-logo-no-text.png" class="img-fluid" alt="Small Logo"></div> <div class="col-9 col-md-9 pl-0 pl-md-5 pr-0 align-self-center"> <h5 class="modal-title">請輸入OpenID:</h5> </div> <div class="col-1 col-md-2 align-self-center"> <button type="button" class="close px-0" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> </div> </div> </div> <hr class="mb-0 d-block d-md-none"/> <div class="modal-body pb-3 pb-md-5"> <div class="container-fluid"> <div class="row d-block"> <form method="POST" id="openIdForm" action="javascript:;"> <div class="anim_form_control mt-4"> <input type="text" id="regAccount" name="openid" required> <span class="highlight"></span> <span class="bar"></span> <label for="regAccount">請輸入OpenID <span class="ft-grapefruit ml-3" id="accountChkInfo"></span> </label> </div> </form> </div> <div class="row mt-4"> <button type="button" onclick="submitForm();" class="btn btn-primary custom_blue_solid_style w-100 py-2" >登入</button> </div> </div> </div> <div class="modal-footer"></div> </div> </div> </div> <!-- OPEN ID Modal --> <script> var isValidRecaptcha = false; var isNotRobot = function() { isValidRecaptcha = true; }; function chkAccountExist(){ if (!$("input[name='regAccount']").val()) { alert('請填寫帳號!'); return false; } var account = $("input[name='regAccount']").val(); $.ajax({ url: '/Template/store/ajax/chkAccountExist.jsp', type: 'GET', async: false, cache: false, data: { account: account }, error: function(xhr) { alert('Ajax request 發生錯誤'); }, success: function(data) { var result = data.trim(); if(result == "true"){ //alert("此帳號已被申請"); $('#accountChkInfo').text("此帳號已被申請"); } else{ //alert("此帳號可以申請註冊"); $('#accountChkInfo').text("此帳號可以申請註冊"); } },complete : function () { //location.reload(); }, beforeSend:function(){ $('#accountChkInfo').text(""); //$('#exchangeZoneResult').empty(); //$('#exchangeZoneResult').append('<dd class="h5 bold my-4"></dd><br>'); } }); } function submitForm(){ $('#openIdForm').attr('action', '/SSO/OpenIdAuth.jsp'); $('#openIdForm').submit(); } </script> </body> </html>