Skip to content

Instantly share code, notes, and snippets.

@nhockm4v

nhockm4v/index.html

Created September 29, 2018 04:10
Show Gist options
  • Save nhockm4v/6c26abcfd1594ca86d57c8656e347dc9 to your computer and use it in GitHub Desktop.
Save nhockm4v/6c26abcfd1594ca86d57c8656e347dc9 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title></title>
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class="bg">
<div class="titlebar">
<div id="-3" class="close-btn"></div>
</div>
<div class="slide">
<img draggable="false" id="img1" class="imgslide" src="banner.png" >
<img draggable="false" id="img2" class="imgslide" src="banner1.png" style="opacity: 0">
</div>
<button class="nextimg" onclick=" chuyenanh (false);"></button>
<button style="margin-left:10px;" onclick=" chuyenanh (true);" class="nextimg"></button>
<div class="logo">
<img draggable="false" id="logoo" class="logoo" src="logo.png" >
<div class="input-name">
<input type="text" placeholder="Tên đăng nhập/E-mail">
<span class="underline-animation"></span>
</div>
<div style="margin-top: 40px;" class="input-name">
<input type="password" placeholder="Mật khẩu">
<span class="underline-animation"></span>
</div>
<label class="container">Nhớ mật khẩu
<input type="checkbox" checked="checked">
<span class="checkmark"></span>
</label>
<button class="login-btn">Đăng nhập</button>
<button class="reg-btn">Tạo tài khoản</button>
<a class="fgpass">Quên mật khẩu?</a>
</div>
</div>
</body>
<script type="text/javascript">
chuyenanh (false);
img = true
setInterval(function () {
chuyenanh (img)
img = !img;
}, 3000)
function chuyenanh (anh) {
if (anh){
document.getElementById('img1').style.opacity = '0';
document.getElementById('img2').style.opacity = '1';
document.getElementsByClassName('nextimg')[1].style.backgroundColor = 'white';
document.getElementsByClassName('nextimg')[0].style.backgroundColor = '#68686F';
}else if (!anh) {
document.getElementById('img1').style.opacity = '1';
document.getElementById('img2').style.opacity = '0';
document.getElementsByClassName('nextimg')[0].style.backgroundColor = 'white';
document.getElementsByClassName('nextimg')[1].style.backgroundColor = '#68686F';
}
}
</script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment