JSFiddle - React, Tailwind, and code Playground
by nsatija
JavaScript
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<meta charset="UTF-8">
<link rel="shortcut icon" href="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href='https://fonts.googleapis.com/css?family=Playfair+Display:700,900|Fira+Sans:400,400italic' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="../css/reset.css">
<!-- CSS reset -->
<link rel="stylesheet" href="../css/style.css">
<!-- Resource style -->
<script src="../js/modernizr.js"></script>
<!-- Modernizr -->
<script src="../js/jquery-2.1.4.js"></script>
<script src="../js/jquery.mobile.custom.min.js"></script>
<script src="../js/jtline.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />
<link href="../css/demo.css" rel="stylesheet" />
<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<script type="text/javascript">
$(document).ready(function() {
var myjSonObject = {
"args": {
},
"dataArray": [{
"isSelected": "true",
"pImge": "../pics/west-1.jpg",
"title": "Point 1",
"subTitle": "March 11 2017",
"dateValue": "11/03/17",
"pointCnt": "Mar 3"
},
{
"isSelected": "",
"pImge": "../pics/west-2.jpg",
"title": "Point 2",
"subTitle": "March 15th 2017",
"dateValue": "17/03/17",
"pointCnt": "Mar 15"
},
{
"isSelected": "",
"pImge": "../pics/west-3.jpg",
"title": "Point 3",
"subTitle": "April 7th 2017",
"dateValue": "7/04/17",
"pointCnt": "Apr 7"
},
{
"isSelected": "",
"pImge":...