从jQuery fancybox 1.3.4中移除下拉阴影

Question

有没有办法去掉下拉阴影效果？

我已经删除了下拉阴影图片，但阴影仍然存在...

谢谢

- Paranoid Android

Answer 1

在jquery.fancybox-1.3.4.css文件中，只需删除或更改以下行：

#fancybox-bg-n {
    top: -20px;
    left: 0;
    width: 100%;
    background-image: url('fancybox-x.png');
}

#fancybox-bg-ne {
    top: -20px;
    right: -20px;
    background-image: url('fancybox.png');
    background-position: -40px -162px;
}

#fancybox-bg-e {
    top: 0;
    right: -20px;
    height: 100%;
    background-image: url('fancybox-y.png');
    background-position: -20px 0px;
}

#fancybox-bg-se {
    bottom: -20px;
    right: -20px;
    background-image: url('fancybox.png');
    background-position: -40px -182px; 
}

#fancybox-bg-s {
    bottom: -20px;
    left: 0;
    width: 100%;
    background-image: url('fancybox-x.png');
    background-position: 0px -20px;
}

#fancybox-bg-sw {
    bottom: -20px;
    left: -20px;
    background-image: url('fancybox.png');
    background-position: -40px -142px;
}

#fancybox-bg-w {
    top: 0;
    left: -20px;
    height: 100%;
    background-image: url('fancybox-y.png');
}

#fancybox-bg-nw {
    top: -20px;
    left: -20px;
    background-image: url('fancybox.png');
    background-position: -40px -122px;
}

- Beto Frega

---

不错！我想我忽略了这个CSS文件 ;) - Paranoid Android

Answer 2

不要忘记IE CSS。这条线以下的所有内容也必须被删除

.fancybox-ie .fancybox-bg { background: transparent !important; }

- peu

Answer 3

我花了大约30分钟的时间才找到了在FancyBox 2.0及以上版本中如何实现此功能。虽然这个问题是针对FancyBox 1系列的，但我认为能够为那些在FancyBox 2.0系列中寻找此功能的人节省一些时间是很好的。

请删除sources/jquery.fancybox.css文件中第41行左右的这些声明。

.fancybox-opened .fancybox-skin {
-webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
   -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
}

- Abhik

Answer 4

不需要更改 lib css，只需在 fancybox css 引入后添加此 CSS

.fancybox-bg {
  display: none;
}

- Matias

Answer 5

在jquery.fancybox的CSS文件中，将"display:none;"添加到.fancybox-bg{...}。

- Siva