`
jungle1171
  • 浏览: 3927 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

解决HighSlide在IE浏览器中到另外一个页面打开的问题

阅读更多

近日做个小站的时候从forum.ubuntu.org.cn得到启发,使用了其图片显示插件HighSlide(http://highslide.com/)。

这个插件的好处不说了,google上满版都是。

只是在使用的过程中,发现一个郁闷的问题,在FF中表现OK,但是在IE6里就抽筋了,点击图片不是弹出一个DIV层,而是跳到另外一个页面使用普通的显示图片的方式打开(此时地址栏里边是:http://localhost:xxx/xxx/xxx/ABC.jpg)。

调试了N久,发现是在我自己的css里有这样的代码:

body{
    width: 1000px;
    margin: 0 auto;padding:0px;
    ......
}

 正是这个width导致了这个问题,这个宽度适当的调大 就可以解决这个问题。至于原因,等有空了再做研究。

或者,看到这篇小文的高手帮忙解答一下~

附html代码:

<html>
    <head>
        <script type="text/javascript" src="highslide/highslide-with-gallery.js"></script>
        <link rel="stylesheet" type="text/css" href="highslide/highslide.css" />
        <title>test highslide</title>
        <script type="text/javascript">
            hs.graphicsDir = 'highslide/graphics/';
            hs.align = 'center';
            hs.transitions = ['expand', 'crossfade'];
            hs.outlineType = "rounded-white";
            hs.fadeInOut = true;
            //hs.dimmingOpacity = 0.75;
        </script>
    </head>
    <body>
        <div class="content">
            <div>
                <!-- flash here -->
            <div class="indexleft">
                <ul>
                    <#list model.gList as g>
                    <li>${g.title}</li>
                    </#list>
                </ul>
            </div>
            <div class="indexright">
                <div class="block">
                    <div class="images">
                        <a href="upload/images/big.jpg" class="highslide" onclick="return hs.expand(this)">
                            <img src="upload/images/small.jpg" alt="Highslide JS" title="Click to enlarge"  width="240px" height="180px"/>
                        </a>
                        <div class="highslide-caption">
                            <div class="producttitle">CXW-218-TV</div>
                            <p>
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
                            </p>
                            价格:&nbsp;&nbsp;RMB 9,999.00<br/>
                            产地:&nbsp;&nbsp;中国 江苏<br/>
                            颜色:&nbsp;&nbsp;银白色<br/>
                        </div>
                    </div>
                    <div class="texts">
                        <div class="title"><a href="#">CXW-218-TV</a></div>
                        <p>
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
                        </p>
                        价格:&nbsp;&nbsp;RMB 9,999.00<br/>
                        产地:&nbsp;&nbsp;中国 江苏<br/>
                        颜色:&nbsp;&nbsp;银白色<br/>
                    </div>
                </div>

            </div>
        </div>
    </body>
</html>
分享到:
评论

相关推荐

    highslide-gallery图片查看器

    Highslide-Gallery是一款广泛应用于网页中的高质量图片查看器,它为用户提供了一种优雅的方式来展示和浏览网站上的图像。Highslide的主要特点是其轻量级、可定制性和用户友好的交互体验,使得图片展示更加生动和吸引...

    highslide

    HighSlide 是一个功能丰富的JavaScript 图片和媒体展示库,它为网页设计师提供了优雅且高效的图片浏览体验。这个库特别适合那些希望在网站上添加高质量图片缩放、滑动以及弹出窗口效果的开发者。HighSlide 的核心...

    highslide丰富的页面前端编程,

    HighSlide是一款功能强大的网页图像和内容展示插件,它以其高效、灵活和用户友好的特性在前端开发领域受到广泛欢迎。HighSlide的主要功能是提供优雅的弹出式图像查看器,同时支持各种媒体类型的嵌入,如图片、视频、...

    highslide-4.0.8最新版&Basic Demo[2008-10-28]

    这是一个很好的图片浏览特效,与lightbox特效相比,最大的优势在于它不需要将网页加载完就能加载特效了,可用在任何程序中。 浏览器兼容性: IE 8 beta 1 Works partly, waiting for more stable beta. IE 5.0...

    highslide图片放大效果

    在网页设计中,高质量的图片展示是吸引用户注意力的关键因素之一,而Highslide正好满足了这一需求。以下是关于Highslide图片放大效果的详细知识点: 1. **基本原理**: Highslide的原理是通过JavaScript动态加载大...

    Highslide插件的使用

    4. 配置扩展内容:如果需要在弹出窗口中显示文本,可以创建一个隐藏的`div`元素,设置其ID并与触发元素关联,Highslide会根据指定的ID找到并显示这部分内容。 5. 自定义样式:根据需要,可以通过`Style.css`和`...

    Highcharts-Highslide.rar

    例如,当用户点击Highcharts中的一个数据点时,可以弹出一个Highslide窗口显示该数据的详细信息或相关图片。这种组合方式在数据分析、报告展示或仪表板应用中非常常见,能够提供深度的用户体验,使数据的呈现更加...

    highslide可拖动的浮动层效果

    标题中的“highslide可拖动的浮动层效果”指的是Highslide库中的一个特性,即创建的弹出窗口(或浮动层)不仅能够自动调整大小适应内容,还允许用户通过鼠标拖动来改变其在页面上的位置。这在展示图片、文字或其他...

    highslide jquery 幻灯片插件(好用)

    总的来说,Highslide jQuery幻灯片插件是一个高效且灵活的解决方案,适用于那些希望在网站上创建美观、交互性强的媒体展示的开发者。通过深入研究提供的示例和配置选项,开发者可以轻松地将其集成到自己的项目中,为...

    highslide-4.1.8图片特效控件

    总的来说,Highslide JS v4.1.8是一个全面的图片特效解决方案,无论是在桌面端还是移动端,都能提供高质量的图片展示效果,是网页设计师和开发者的得力工具。通过下载并研究压缩包中的文件,例如codefans.net,你...

    highslide-4.1.13 Dome

    使用视觉Highslide编辑器来设置Highslide安装,无需编写代码。 快速而优雅。 不需要像Flash或Java插件。 弹出拦截器没有问题。打开浏览器窗口内活跃的内容。 单击。打开后的图像或HTML弹出,用户可以进一步滚动或离开...

    highslide-4.1.9(含例子,很酷的)

    Highslide 是一个流行的JavaScript 图像展示库,以其高质量的弹出式图像滑动效果而闻名。这个"highslide-4.1.9"版本包含了该库的一个实例,为用户提供了一个直观的学习和应用平台,无需担心如何开始使用。下面将详细...

    highslide图片文字各种效果

    HighSlide是一款功能强大的JavaScript图像和文字...总之,HighSlide是一个强大的工具,它为网页设计提供了丰富的图片和文本互动效果,通过灵活的配置和高度的定制性,可以帮助开发者创造出独特且引人入胜的用户体验。

    highslide-4.1.9 非常好的 弹出div 图片浏览js

    总的来说,Highslide-4.1.9是一个功能完备且易用的JavaScript图片浏览解决方案。它不仅提供了丰富的图片展示效果,还考虑到了用户体验和性能优化。对于需要在网页中添加高质量图片浏览功能的开发者来说,Highslide...

    HighSlide JS

    这是一个很漂亮的图片弹出样式,类似缩放效果。个人认为比Lightbox JS要好。 Highslide JS is an open source JavaScript software, offering a Web 2.0 approach to popup windows. It streamlines the use of ...

    highslide-4.1.13

    总之,Highslide JS 4.1.13是一个强大而灵活的图片浏览解决方案,适用于需要提升用户体验的任何网页项目。通过理解和运用这些知识点,开发者可以轻松地在自己的网站上实现高质量的图片预览功能。

    highslide放大图片展示

    HighSlide 是一个流行的JavaScript图像和媒体展示库,它允许用户在网页上实现优雅的图片放大效果,同时提供了丰富的自定义选项和功能。这个压缩包文件包含的资源可能用于创建一个HighSlide图片展示示例,包括...

    ja_highslide

    ja_highslide用于joomla

    highslide-4.1.8

    "Highslide JS 4.1.8" 是一个流行的JavaScript库,主要用于在网页上实现高效、用户友好的图片管理和展示功能。它提供了多种图片查看方式,使得网页中的图片浏览体验更加丰富和互动。这个库特别适合那些需要在网站上...

    highslide-gallery

    "Highslide Gallery"是一个流行的JavaScript图像展示库,用于在网页上创建高质量的、交互式的图片画廊。这个压缩包文件包含了一系列与Highslide Gallery相关的资源,让我们深入了解一下这个工具及其组成部分。 首先...

Global site tag (gtag.js) - Google Analytics