JQ 與 Vue 結合

四、【#app】區下方按鈕,大圖替換顯示,並滑鼠靠上去時,產生小圖

範例結果

S1:利用JQ,當按下【.title li】下方按鈕時,照片替換

S2:利用JQ,由大圖抓取檔案路徑,置於下方【.title li】後面

S2-1:先在html結構,利用hover加【.hover】類別名稱,加入小圖情形

※JQ沒有【:before】及【:after】偽元素

S2-2:小圖加入【.hoverimg】後進行CSS美化

S2-3:測試完成後,將html結構中S2-1步驟的小圖註解,備用

S3:利用JQ,由大圖抓取檔案路徑,置於【.title li】上方

參考連結(本網)