142 lines
5.7 KiB
HTML
142 lines
5.7 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
|
||
<meta name="keywords" content="Flyovers, Mumbai, Construction, Traffic, overpass, skywalk" />
|
||
<meta name="title" content="Vertical Urbanism" />
|
||
<meta name="description" content="This site maps the landscapes of elevated road highways – flyovers – and elevated pedestrian walkways – skywalks – across the Mumbai Metropolitan Region in Western India." />
|
||
<link rel="stylesheet" type="text/css" href="/static/css/vurbanism.css" />
|
||
<title>Vertical Urbanism: Flyovers in Mumbai</title>
|
||
<link rel="stylesheet" type="text/css" href="/static/css/colorbox.css" />
|
||
<script type="text/javascript" src="/static/js/jquery.js"></script>
|
||
<script type="text/javascript" src="/static/js/jquery.colorbox-min.js"></script>
|
||
<script type="text/javascript" src="/static/js/openlayers/OpenLayers.js"></script>
|
||
<script src='http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAsn1j-ZGGtRgZ9aMJPCZbRxTEwe8r4EmncxniwLCEI2F-aeUoNRTBAUi3uvVAsZpLkcO78Ryd18Hfaw'></script>
|
||
|
||
<script type="text/javascript" src="/static/js/vurbanism.js"></script>
|
||
|
||
|
||
</head>
|
||
<body>
|
||
<script type="text/html" id="tmpl_images">
|
||
<div class="imagesWrapper">
|
||
<% for (var i=0; i<images.length;i++) { var img = images[i]; %>
|
||
<div class="imageWrapper">
|
||
<a href="<%= img.sizes[3].source %>" class="flyoverImage" title="<%= img.caption %>" data-id="<%= img.flyover.id %>" rel="group_<%= img.id %>">
|
||
<img src="<%= img.sizes[0].source %>" alt="<%= img.caption %>" />
|
||
</a>
|
||
</div>
|
||
<% } %>
|
||
|
||
</div>
|
||
</script>
|
||
|
||
<script type="text/html" id="tmpl_videos">
|
||
<div class="videosWrapper">
|
||
<% for (var i=0; i<videos.length;i++) { var vid = videos[i]; %>
|
||
<div class="videoWrapper">
|
||
<a href="#" class="flyoverVideo flyoverImage" title="<%= vid.info.description %>" data-id="<%= vid.flyover.id %>" rel="group_<%= vid.id %>">
|
||
<img src="<%= vid.info.thumbnail %>" alt="<%= vid.info.description %>" />
|
||
</a>
|
||
</div>
|
||
<% } %>
|
||
|
||
</div>
|
||
</script>
|
||
|
||
<script type="text/html" id="tmpl_texts">
|
||
<div class="textsWrapper">
|
||
<% for (var i=0; i<texts.length;i++) { var txt = texts[i]; %>
|
||
<p class="textWrapper flyoverImage" data-id="<%= txt.flyover.id %>">
|
||
<%= txt.text %>
|
||
</p>
|
||
<% } %>
|
||
</div>
|
||
</script>
|
||
|
||
<div id="wrapper">
|
||
<div id="categories">
|
||
<table>
|
||
<tr>
|
||
<td class="imageCategory" data-id="11">Flyover sweeps</td>
|
||
<td class="imageCategory" data-id="1">Central underview</td>
|
||
<td class="imageCategory" data-id="9">Models</td>
|
||
<td class="imageCategory" data-id="16">Skywalk sweeps</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="imageCategory" data-id="6">Signs</td>
|
||
<td class="imageCategory" data-id="7">Piers</td>
|
||
<td class="imageCategory" data-id="15">Columns</td>
|
||
<td class="imageCategory" data-id="13">End surfaces</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="imageCategory" data-id="4">Unfinished</td>
|
||
<td class="imageCategory" data-id="12">Construction</td>
|
||
<td class="videoCategory" data-id="2">Construction</td>
|
||
<td class="textCategory" data-id="6">Media</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="imageCategory" data-id="2">Regulation</td>
|
||
<td class="imageCategory" data-id="10">Fencing</td>
|
||
<td class="videoCategory" data-id="4">In The Way</td>
|
||
<td class="textCategory" data-id="5">Technical</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="imageCategory" data-id="14">Greenspace</td>
|
||
<td class="imageCategory" data-id="8">Posters</td>
|
||
<td class="videoCategory" data-id="1">Routes</td>
|
||
<td class="textCategory" data-id="4">Stories</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="imageCategory" data-id="5">Life underneath</td>
|
||
<td class="imageCategory" data-id="3">Storing / Selling</td>
|
||
<td class="videoCategory" data-id="3">Stills underneath</td>
|
||
<td class="audioCategory" data-id="">Sounds</td>
|
||
</tr>
|
||
</table>
|
||
</div>
|
||
<div id="map">
|
||
|
||
</div>
|
||
<div id="buttons">
|
||
<a class="navButton" href="Javascript:$.noop()" data-target="about" id="aboutBtn">About</a>
|
||
<a class="navButton" href="Javascript:$.noop()" data-target="questions" id="questionsBtn">Questions</a>
|
||
</div>
|
||
<div id="media">
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<div class="navContent" id="about">
|
||
<div class="contentWrapper about">
|
||
|
||
<p>This site maps the landscapes of elevated road highways – flyovers – and
|
||
elevated pedestrian walkways – skywalks – across the Mumbai Metropolitan
|
||
Region in Western India.
|
||
|
||
<p>Both flyovers and skywalks have become a highly visible feature of Mumbai’s
|
||
recent rapid urbanisation. The number of flyovers increased from 13 in 1997
|
||
to over 60 by 2009, while the first skywalks were constructed in 2008. Many
|
||
more projects are ongoing and proposed.
|
||
|
||
<p>By assembling and categorising photographs, videos, audio-clips and text,
|
||
this site allows users to explore some of the new and diverse urban worlds
|
||
created through flyover and skywalk construction.
|
||
|
||
<p>All material was collected between April 2009 and January 2010 by Andrew
|
||
Harris with the assistance of Savitri Medhatul. The website was devised by
|
||
Andrew Harris and created by Sanjay Bhangar.The research was funded by
|
||
the UK’s Economic and Social Research Council and the Urban Laboratory of
|
||
University College London.</p>
|
||
<img src="/static/images/urbanlablogo.jpg" alt="Urban Lab Logo" title="Urban Lab" />
|
||
<img src="/static/images/esrclogo.jpg" alt="ESRC Logo" title="Economic and Social Research Council" />
|
||
</div>
|
||
</div>
|
||
<div class="navContent" id="questions">
|
||
<div class="contentWrapper questions">
|
||
Soon.
|
||
</div>
|
||
</div>
|
||
</body>
|
||
|
||
</html>
|