2012-04-28 34 views
4

所以我有一個假的小iOS 5風格的開關,我使用這種技術構建,使用較小的div作爲視口,並使用較大的div作爲通過該視口可見的內容。它在webkit中完全失敗了,因爲除了靜態設置任何子元素之外,當計算溢出爲隱藏時,它並不尊重邊界半徑。css位置,邊框半徑,溢出在webkit中不受尊重 - 其他解決方案?

Original effort on jsfiddle

Solution on jsfiddle

說真的,我不知道三兩件事:

  1. 爲什麼沒有WebKit的證實這是一個錯誤嗎? (https://bugs.webkit.org/show_bug.cgi?id=72619)
  2. 有沒有其他的解決方法可以讓人們知道這個bug - 專門針對我描述的視口技術?
  3. 更多的是一個旁註,真的。視口技術是否有一個我應該稱之爲真實的正式名稱?
+0

我不知道約1%,但它肯定是一個錯誤。 CSS規範明確指出border-radius會改變填充邊緣,這是溢出裁剪的要點。我能想到的唯一其他技術是添加一個使用部分透明圖像的子元素作爲粗略的剪貼蒙版 - 因此切換「持有人」實際上是孩子。雖然不是一個好的解決方案。 – 2012-05-02 19:28:01

+0

我複製並粘貼了測試代碼,並使用Google Chrome在本地主機上運行它。我不知道爲什麼它運行正確,除了溫暖和冷的位置在溫暖的div開始之間的圈子。 – Stencil 2012-05-06 14:15:25

回答