Skip to content

Instantly share code, notes, and snippets.

@suriyadeepan

suriyadeepan/index.html

Created June 23, 2015 07:29
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save suriyadeepan/90d7d8ecdfce357e0d82 to your computer and use it in GitHub Desktop.
Save suriyadeepan/90d7d8ecdfce357e0d82 to your computer and use it in GitHub Desktop.
Download ZIP
Solves the issue
Raw
index.html
<body class="landing">
<div id="topdiv" class="button special"> <a href="#page-wrapper" class="goto-next scrolly"></a></div>
<div id="page-wrapper">
<!-- Header -->
<p id="#demo1"></p>
<button onclick="myFunction();">Change</button>
<br>
<img id="dateimage1" class='change-img' src="http://vignette4.wikia.nocookie.net/pacman/images/2/2d/Pinkyyghost.png/revision/latest?cb=20090919170357" alt="Loading..." width="75%" />
<!-- Banner -->
<section id="banner">
<div class="content">
<header>
<h2>header</h2>
<p>And there are no hoverboards or flying cars.
<br /> Just apps..</p>
</header>
<span>
<p id="#demo2"></p>
<!-- image tag working -->
<img id="dateimage2" class='change-img' src="http://images.clipartpanda.com/one-clipart-number-one-gray-md.png" alt="Loading..." width="75%" />
</span>
</div>
<a href="#one" class="goto-next scrolly">Next</a>
</section>
<!-- One -->
<section id="one" class="spotlight style1 bottom">
<span class="image fit main">
<p id="#demo3"></p>
<!-- image tag not working -->
<img id="dateimage3" class='change-img' src="http://images.clipartpanda.com/one-clipart-number-one-gray-md.png" alt="Loading..." width="75%" />
</span>
<div class="content">
<div class="container">
<div class="row">
<div class="4u 12u$(medium)">
<header>
<h2>Odio faucibus ipsum integer consequat</h2>
<p>Nascetur eu nibh vestibulum amet gravida nascetur praesent</p>
</header>
</div>
<div class="4u 12u$(medium)">
<p>Feugiat accumsan lorem eu ac lorem amet sed it orci porttitor semper. aliquet augue varius tempus lobortis porttitor accumsan consequat adipiscing lorem dolor.</p>
</div>
<div class="4u$ 12u$(medium)">
<p>Morbi enim nascetur et placerat lorem sed iaculis neque ante adipiscing adipiscingmassa. Blandit orci porttitor semper. Arcu phasellus tortor enim mi mi </p>
</div>
</div>
</div>
</div>
<a href="#two" class="goto-next scrolly">Next</a>
</section>
<script>
function myFunction(){
var date = new Date();
var day = date.getDay();
if(day ===2){
$('.change-img').attr('src', 'https://americanthings.files.wordpress.com/2009/10/calvin-and-hobbes-small-by-geocitiesdotcomslashmalimodeinblack.jpg');
}else if(day ===3){
$('.change-img').attr('src', 'https://upload.wikimedia.org/wikipedia/commons/thumb/d/d0/Joker_black_02.svg/140px-Joker_black_02.svg.png');
}
};
</script>
<!-- change the image depending on Date -->
<!-- dateimage1 2 3 4 5 6 7 8 are image Tags -->
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment