非常好用的 Highslide JS ，完全可以顶替 lightbox-JavaSript-爱易网页

非常好用的 Highslide JS ，完全可以顶替 lightbox

日期：2014-05-16　浏览次数：20392 次

非常好用的 Highslide JS ，完全可以代替 lightbox

主页：

http://highslide.com/

实例：

http://highslide.com/index.htm

自定义下载：

http://highslide.com/editor/

文档

http://highslide.com/ref/

图表

http://www.highcharts.com/demo/

Highcharts JS是一个纯JavaScript制图Library，支持的图表类型包括：line、spline、area、areaspline、column、 bar、pie和scatter。当鼠标移到图表上时会利用一个tooltip展示每一点或区域上相关的文本信息。可以放大图表，查看某部分更详细的数据。Highcharts支持大部分浏览器包括iPhone和IE6。源码及实例

附上一个小技巧：

<script type="text/javascript">
    hs.graphicsDir = 'highslide/graphics/';
    hs.showCredits = false;
</script>

通过设置showCredits 的属性可以控制 gallery左上角是否出现 “powered by highslide js” 的超链接，当然，您也可以直接在highslide.js 文件中直接修改它的值。

实例：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "xhtml11.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Highslide JS - Custom Example</title>

<script type="text/javascript" src="highslide/highslide.js"></script>
<link rel="stylesheet" type="text/css" href="highslide/highslide.css" />
<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="highslide/highslide-ie6.css" />
<![endif]-->

<script type="text/javascript">
hs.graphicsDir = 'highslide/graphics/';
hs.outlineType = 'custom';
hs.captionEval = 'this.a.title';
</script>

</head>
<body>
<h3>Single image</h3>
<div style="text-align: justify">

	<a href="highslide/sample-images/full-image.jpg" class="highslide" onclick="return hs.expand(this)"
			
			title="Caption from the anchor's title attribute" style="float:right; margin: 0 0 10px 15px">
		<img src="highslide/sample-images/thumbnail.jpg"  alt=""
			style="width: 107px;height:120px;" />
	</a>

	<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
	tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
	quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
	Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
	fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa
	qui officia deserunt mollit anim id est laborum.</p>
</div>

</body>
</html>

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

非常好用的 Highslide JS ，完全可以顶替 lightbox

相关资料更多>

推荐阅读更多>