https://www.lativ.com.tw/
目前在練習實作lativ官網的一些功能
碰上了幾個問題
1.右上角的會員登入
2.一樣右上角的購物車
會員登入那邊想一樣點擊跑出視窗
我看他好像是用iframe做的,可是我一直不太懂要怎麼做,
我的想法是iframe display先none click的時候在出現
可是出現的位置 和背景變灰 完全沒概念
而購物車那邊 用jquery slideup slidedown 一直被下方圖片擋住
調過z-index也沒作用
有大大能稍微提點一下嗎
z-index有調整到重點嗎?
通常套件出來的結果,
id跟class都已經不一樣了,
(通常改的會是class)
你要改的是改完之後的id或class,
不是你寫的網頁裡的id或class,
或甚至可能要改的不是你原本看到的那個標籤(div?)
有可能是套件自己產生的標籤才是你要去改的,
之前也遇到類似的情況一直改不好,
後來才發現沒有改到重點,
找到重點之後就成功改好了 :)
如果是用chrome的話,
可以善用F12開發人員工具來觀察,
其他瀏覽器應該也有提供這樣的功能。
改完以後你會對前端更瞭解。
會員登入跳出來的不是iframe
可以參考bootstrap的modal效果
http://bootstrap.hexschool.com/docs/4.0/components/modal/
圖片類也可以參考lightbox效果
http://lokeshdhakar.com/projects/lightbox2/
slidedown擋住改zindex沒用的話,檢查一下有沒有加position:absolute吧
建議還是用https://codepen.io/ 把code貼出來,比較方便討論
modal做出來了!!感謝大大的提點!!
可是又有另外的問題跑出來了...
我的slide現在完全掛掉
流覽器F12 顯示
Uncaught TypeError: $(...).slideUp is not a function
......
是因為我用了這些嗎
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>
原本是用 google的
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
怎麼會這樣><