Skip to content

Instantly share code, notes, and snippets.

@Techgokul

Techgokul/like&dislike.html

Created June 9, 2018 07:24
Show Gist options
  • Save Techgokul/6e120a3f7fa7141dae07082b13edfe36 to your computer and use it in GitHub Desktop.
Save Techgokul/6e120a3f7fa7141dae07082b13edfe36 to your computer and use it in GitHub Desktop.
Download ZIP
Create a Like and Dislike Button using html,css and js
Raw
like&dislike.html
<html>
<head>
<title>Like and Dislike</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css">
<style>
.fa{
font-size: 300px;
color: white;
cursor: pointer;
width: 400px;
height: 400px;
background-color: cornflowerblue;
border-radius: 100%;
line-height: 400px;
text-align: center;
}
.fa:hover{
color: khaki;
}
</style>
</head>
<body>
<i onclick="myfunction(this)" class="fa fa-thumbs-up"><a type="text" id="show"></a></i>
<script>
function myfunction(x)
{
x.classList.toggle("fa-thumbs-down");
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment