Skip to content

Instantly share code, notes, and snippets.

@greeneggsandmushrooms

greeneggsandmushrooms/index.html

Created October 31, 2017 00:02
Show Gist options
  • Save greeneggsandmushrooms/5f6d9a44e288072503b60489500f0623 to your computer and use it in GitHub Desktop.
Save greeneggsandmushrooms/5f6d9a44e288072503b60489500f0623 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-2.0.3.js"></script>
</head>
<body>
<!-- <h1>Header 1</h1>
<h2>Header 2</h2>
<button>Button</button> -->
<h1 id="title">Title</h1>
<p>Paragraph</p>
<button id="button1">FadeOut</button>
<button id="button2">FadeIn</button>
<div id="redDiv" style="background:red; height:50px; width:50px;"></div>
<script id="jsbin-javascript">
/*
$(document).ready(function(){
$("button").click(function(){
$("h1").fadeOut();
});
});
*/
/*
$(document).ready(function(){
$("#button1").click(function(){
$("#title").fadeOut();
});
});
$(document).ready(function(){
$("#button2").click(function(){
$("#title").fadeIn();
});
});
*/
/*
$(document).ready(function(){
$("#button1").click(function(){
$("#redDiv").fadeOut();
});
});
$(document).ready(function(){
$("#button2").click(function(){
$("#redDiv").fadeIn();
});
});
*/
/*
$(document).ready(function(){
$("#button1").click(function(){
$("#redDiv").css({"background-color":"orange"});
});
});
$(document).ready(function(){
$("#button2").click(function(){
$("#redDiv").css({"background-color":"purple"});
});
});
*/
</script>
<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-2.0.3.js"><\/script>
</head>
<body>
<\!-- <h1>Header 1</h1>
<h2>Header 2</h2>
<button>Button</button> -->
<h1 id="title">Title</h1>
<p>Paragraph</p>
<button id="button1">FadeOut</button>
<button id="button2">FadeIn</button>
<div id="redDiv" style="background:red; height:50px; width:50px;"></div>
</body>
</html>
</script>
<script id="jsbin-source-javascript" type="text/javascript">/*
$(document).ready(function(){
$("button").click(function(){
$("h1").fadeOut();
});
});
*/
/*
$(document).ready(function(){
$("#button1").click(function(){
$("#title").fadeOut();
});
});
$(document).ready(function(){
$("#button2").click(function(){
$("#title").fadeIn();
});
});
*/
/*
$(document).ready(function(){
$("#button1").click(function(){
$("#redDiv").fadeOut();
});
});
$(document).ready(function(){
$("#button2").click(function(){
$("#redDiv").fadeIn();
});
});
*/
/*
$(document).ready(function(){
$("#button1").click(function(){
$("#redDiv").css({"background-color":"orange"});
});
});
$(document).ready(function(){
$("#button2").click(function(){
$("#redDiv").css({"background-color":"purple"});
});
});
*/</script></body>
</html>
Raw
jsbin.betudov.js
/*
$(document).ready(function(){
$("button").click(function(){
$("h1").fadeOut();
});
});
*/
/*
$(document).ready(function(){
$("#button1").click(function(){
$("#title").fadeOut();
});
});
$(document).ready(function(){
$("#button2").click(function(){
$("#title").fadeIn();
});
});
*/
/*
$(document).ready(function(){
$("#button1").click(function(){
$("#redDiv").fadeOut();
});
});
$(document).ready(function(){
$("#button2").click(function(){
$("#redDiv").fadeIn();
});
});
*/
/*
$(document).ready(function(){
$("#button1").click(function(){
$("#redDiv").css({"background-color":"orange"});
});
});
$(document).ready(function(){
$("#button2").click(function(){
$("#redDiv").css({"background-color":"purple"});
});
});
*/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment