/
Using Lightbox with iShare Lite

Using Lightbox with iShare Lite

By Kim Stimpson
27 Apr, 2017

After you have configured your iShare Lite html then this can be included in your html to display the map in Lightbox e.g.

Example
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
	<head>
		<title>iShare - Lite [ lightbox ]</title>
	</head>
	<body style="font-size: 75.0%;">
		
		<link rel="stylesheet" href="http://www.no-margin-for-errors.com/wp-content/themes/NMFE/css/prettyPhoto.css" type="text/css" media="screen" />
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
		<script src="http://www.no-margin-for-errors.com/wp-content/themes/NMFE/js/jquery.prettyPhoto.js" type="text/javascript"></script>
		<script type="text/javascript" charset="utf-8">$(function(){ $("#atIshareLite").prettyPhoto();});</script>
		<style>.pp_description,.pp_social,.pp_description{display:none !important;}</style>
		
		<a id="atIshareLite" href="atLiteMap.html?iframe=true&width=320&height=340" rel="prettyPhoto[iframes]" title="iShareLite">Open iShareLite in lightBox</a>
		
	</body>
</html>

Where the href="atLiteMap.html is your iShare Lite page as defined in the iShare Lite Map Example code.

Related content