高幻灯片:问题导致图像重新缩小 [英] Highslide: Issues re-shrinking image

问题描述

首先，只想感谢作者免费提供了很多这段代码，并感谢社区帮助像我这样的不懂Java的人.

First off, just want to thank the author for making this great bit of code available for free, and the community for helping java-illiterate folks such as myself.

任何人，这是我的问题:单击缩略图将其放大时，它就可以正常放大.但是，当它放大时，我唯一可以缩小它的方法是将光标放在非常细的〜1px边框上.在图像本身上方时，我没有看到放大镜收缩光标.如果您想查看问题，该代码位于 http://www.coloradocanopyclub.com/photos. html .

Anywho, here is my issue: When I click a thumbnail to enlarge it, it enlarges just fine. However, when it's enlarged, the only way I can shrink it is by placing the cursor on the very thin ~1px border. I do not get the magnifying glass shrink cursor when over the image itself. If you wish to view the problem, the code is live at http://www.coloradocanopyclub.com/photos.html.

* 编辑要添加 * :此问题似乎仅影响第一张照片. (tallison.JPG)

*EDIT TO ADD* This issue seems to be affecting the first photo ONLY. (tallison.JPG)

感谢您的帮助！

推荐答案

style.css文件顶部的通用选择器会导致此问题:
* {margin:0px;padding:0px;top:0px;left: 0}
可以将所有元素的边距和边距都设置为0是可以的，但是当您将所有相对/绝对位置的元素的顶部/左侧位置都设置为0时，问题就开始了.

The universal selector at the top of your style.css file causes this problem:
* {margin:0px;padding:0px;top:0px;left: 0}
It’s ok to set margin and padding to 0 for all elements, but the problem starts when you sets top/left position for all relative/absolute positioned elements 0.

您可能已经注意到"Highslide"全展开按钮.此按钮放置在图像顶部的覆盖层中.全展开按钮的标准位置在右下角: http://screencast.com/t/WPP4iwwCI9dq您的通用选择器将其移至左上角: http://screencast.com/t/maXl9rzveH 何时使用CSS这样移动按钮，将得到覆盖整个图像的叠加层-在此屏幕截图中为红色: http://screencast.com/t/6pdDnxaMRQ -无法关闭图像.

You’ve probably noticed the Highslide full-expand button. This button is placed in an overlay on top of the image. Standard position for the full-expand button is bottom right corner: http://screencast.com/t/WPP4iwwCI9dq Your universal selector moves it to upper left corner: http://screencast.com/t/maXl9rzveH When the button is moved like this with CSS, it will result in an overlay that covers the entire image – colored red in this screenshot: http://screencast.com/t/6pdDnxaMRQ - which makes it impossible to close the image.

您需要将通用选择器更改为此:
* {margin:0px;padding:0px;}
并仅将top:0px;left:0px;添加到所需的选择器中，据我所知，这些选择器是#navlist li a span和#content

You need to change your universal selector to this:
* {margin:0px;padding:0px;}
And add top:0px;left:0px; only to the selectors where you need it, which are (as far as I can see) #navlist li a span and #content

这篇关于高幻灯片:问题导致图像重新缩小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！