Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!doctype html>
<html>
<head>
<link href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.min.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>
<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
<script src="http://code.jquery.com/jquery-git2.js"></script>
<meta charset="utf-8">
<title>Roadside Connect</title>
<!-- stylesheet starts here -->
<link href="../css/style.css" rel="stylesheet" type="text/css">
<link href="../css/responsive.css" rel="stylesheet" type="text/css">
<!-- stylesheet ends here -->
<!-- jquery library file -->
<!--<script src="../lib/jquery-1.8.1.min.js"></script>-->
<!--<script src="../lib/jquery-1.7.1.min.js"></script>-->
<script type="text/javascript" src="../lib/jquery-2.1.0.js"></script>
<script type="text/javascript" src="../lib/jquery-tools-1.0.js"></script>
<script type="text/javascript" src="../lib/jquery-incrementer-1.0.js"></script>
<script src="../js/legend.js"></script>
</head>
​
<body id="map2">
<div>
<header>
<nav>
<ul class="mainmenu">
<li><a class="dashj" href="#">jobs</a></li>
<li><a href="#"">drivers</a></li>
<li><a href="#""><span>4</span>notifications</a></li>
</ul>
</nav>
<div class="rht-box">
<figure><a href="index.html" title="Logout"><img src="../img/RC_Web_landing_LogoutIcon1x.png"></a></figure>
<figure><img src="../img/RC_Web_landing_logo_RC.png"></figure>
</div>
<div class="clear"></div>
</header>
​
<div class="job-list">
<ul class="submenu">
<li><a class="job1" href="#">all</a></li>
<li><a class="new" href="#"><span>2</span>New</a></li>
<li><a class="unassigned" href="#"><span>1</span>Unassigned</a></li>
<li><a class="activejob" href="#"><span>4</span>Active</a></li>
<li><a id="collapse" href="#">&mdash;</a></li>
</ul>
</div>
​
<!--<div class="job-list">
<ul class="submenu">
<li><a class="job1" href="#">all2</a></li>
<li><a class="new" href="#"><span>2</span>New2</a></li>
<li><a class="unassigned" href="#"><span>1</span>Unassigned2</a></li>
<li><a class="activejob" href="#"><span>4</span>Active2</a></li>
<li><a href="#">...</a></li>
</ul>
</div> -->
​
​
<div id="page-wrap" class="all-menu">
<!-- new jobs -->
<div class="persist-area">
<article>
<section>
<h5>new jobs</h5>
<figure><img src="../img/joblist/RC_web_icn_map_newjob_sm2x.png"></figure>
<div>
<h4>door unlock - road service</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="timer"><img src="../img/joblist/timer-1.png"></div>
</section>
<div class="clear"></div>
</article>
​
​
<article>
<section>
<figure><img src="../img/joblist/RC_web_icn_map_newjob_sm2x.png"></figure>
<div>
<h4>tow - medium duty flat bed</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="timer"><img src="../img/joblist/timer-2.png"></div>
</section>
<div class="clear"></div>
</article>
</div>
<!-- new jobs -->
​
<!-- unassigned jobs -->
<div class="persist-area">
<article>
<section>
<h5>unassigned jobs</h5>
<figure><img src="../img/joblist/RC_web_icn_map_unassigned_sm2x.png"></figure>
<div>
<h4>tow - medium duty flat bed</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="d-t">
<h6>today, 3:05pm</h6>
<h6>PO# 14901827341</h6>
</div>
</section>
<div class="clear"></div>
</article>
</div>
<!-- unassigned jobs -->
​
<!-- active jobs -->
<div class="persist-area">
<article>
<section>
<h5>active jobs</h5>
<figure><img src="../img/joblist/RC_web_icn_status_inroute_sm_default2x.png"></figure>
<div>
<h4>lockout - minor roadservice</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="d-t">
<h6>today, 3:05pm</h6>
<h6>PO# 14901827341</h6>
</div>
</section>
<div class="clear"></div>
</article>
<article>
<section>
<figure><img src="../img/joblist/RC_web_icn_status_onscene_sm_default2x.png"></figure>
<div>
<h4>lockout - minor roadservice</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="d-t">
<h6>today, 3:05pm</h6>
<h6>PO# 14901827341</h6>
</div>
</section>
<div class="clear"></div>
</article>
<article>
<section>
<figure><img src="../img/joblist/RC_web_icn_status_inroute_sm_default2x.png"></figure>
<div>
<h4>lockout - minor roadservice</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="d-t">
<h6>today, 3:05pm</h6>
<h6>PO# 14901827341</h6>
</div>
</section>
<div class="clear"></div>
</article>
</div>
<!-- active jobs -->
​
<!-- pending jobs -->
<div class="persist-area">
<article class="bg-grey">
<section>
<h5>pending</h5>
<figure><img src="../img/joblist/RC_web_icn_map_newjob_sm2x.png"></figure>
<div>
<h4>door unlock - road service</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="timer"><img src="../img/joblist/timer-1.png"></div>
</section>
<div class="clear"></div>
</article>
<article class="bg-grey">
<section>
<figure><img src="../img/joblist/RC_web_icn_status_cancelled_sm_default2x.png"></figure>
<div>
<h4>tow - medium duty flat bed</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="d-t">
<h6>today, 3:05pm</h6>
<h6>PO# 14901827341</h6>
</div>
</section>
<div class="clear"></div>
</article>
</div>
<!-- pending jobs -->
​
<!-- inactive jobs -->
<div class="persist-area">
<article>
<section>
<h5>inactive</h5>
<figure><img src="../img/joblist/RC_web_icn_status_cancelled_sm_default2x.png"></figure>
<div>
<h4>tow - medium duty flat bed</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="d-t">
<h6>today, 3:05pm</h6>
<h6>PO# 14901827341</h6>
</div>
</section>
<div class="clear"></div>
</article>
<article>
<section>
<figure><img src="../img/joblist/RC_web_icn_status_refused_sm_default2x.png"></figure>
<div>
<h4>tow - medium duty flat bed</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="d-t">
<h6>today, 3:05pm</h6>
<h6>PO# 14901827341</h6>
</div>
</section>
<div class="clear"></div>
</article>
</div>
<!-- inactive jobs -->
</div>
​
​
<!-- new jobs -->
<div class="all-menu-new">
<div id="details1" onclick="details('details1', 'test1')">
<article>
<section>
<figure><img src="../img/joblist/RC_web_icn_map_newjob_sm2x.png"></figure>
<div>
<h4>door unlock - road service</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="timer"><img src="../img/joblist/timer-1.png"></div>
</section>
<div class="clear"></div>
</article></div>
<div id="details1" onclick="details('details1', 'test1')">
<article>
<section>
<figure><img src="../img/joblist/RC_web_icn_map_newjob_sm2x.png"></figure>
<div>
<h4>tow - medium duty flat bed</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="timer"><img src="../img/joblist/timer-2.png"></div>
</section>
<div class="clear"></div>
</article>
</div></div>
<!-- new jobs -->
​
​
​
​
<!-- unassigned jobs -->
<div class="all-menu-unass">
<article>
<section>
<figure><img src="../img/joblist/RC_web_icn_map_unassigned_sm2x.png"></figure>
<div>
<h4>tow - medium duty flat bed</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="d-t">
<h6>today, 3:05pm</h6>
<h6>PO# 14901827341</h6>
</div>
</section>
<div class="clear"></div>
</article>
</div>
<!-- unassigned jobs -->
​
<!-- active jobs -->
<div class="all-menu-active">
<article>
<section>
<figure><img src="../img/joblist/RC_web_icn_status_inroute_sm_default2x.png"></figure>
<div>
<h4>lockout - minor roadservice</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="d-t">
<h6>today, 3:05pm</h6>
<h6>PO# 14901827341</h6>
</div>
</section>
<div class="clear"></div>
</article>
<article>
<section>
<figure><img src="../img/joblist/RC_web_icn_status_onscene_sm_default2x.png"></figure>
<div>
<h4>tow - medium duty flat bed</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="d-t">
<h6>today, 3:05pm</h6>
<h6>PO# 14901827341</h6>
</div>
</section>
<div class="clear"></div>
</article>
<article>
<section>
<figure><img src="../img/joblist/RC_web_icn_map_towinprogress_sm2x.png"></figure>
<div>
<h4>lockout - minor roadservice</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="d-t">
<h6>today, 3:05pm</h6>
<h6>PO# 14901827341</h6>
</div>
</section>
<div class="clear"></div>
</article>
<article>
<section>
<figure><img src="../img/joblist/RC_web_icn_map_destarrival_sm2x.png"></figure>
<div>
<h4>tow - medium duty flat bed</h4>
<p>123 main st, medford, MA 02155 garage 4, oak blvd, cross street</p>
</div>
<div class="d-t">
<h6>today, 3:05pm</h6>
<h6>PO# 14901827341</h6>
</div>
</section>
<div class="clear"></div>
</article>
</div>
​
​
<!-- active jobs -->
​
​
​
​
​
​
​
</body>
</html>
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers