shubh - HTMLify profile
shubh
87 Files
18941 Views
Latest files of /shubh/
javascript/
shubh/javascript/
html css project/
shubh/html css project/
VID-20220908-WA0004.mp4
shubh/VID-20220908-WA0004.mp4
Media file
LPBGI.jpg
shubh/LPBGI.jpg
Media file
jewerlery.jpg
shubh/jewerlery.jpg
Media file
Landing Page.html
shubh/Landing Page.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="LandingPageStyle.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="LandingPageStyle.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
LandingPageStyle.css
shubh/LandingPageStyle.css
* {
margin: 0px;
padding: 0px;
box-sizing: border-box;
}
body {
background-image: url("LPBGI.jpg");
margin: 0px;
padding: 0px;
box-sizing: border-box;
}
body {
background-image: url("LPBGI.jpg");
Doraemon_Image1.png
shubh/Doraemon_Image1.png
Media file
Doraemon_Image2.png
shubh/Doraemon_Image2.png
Media file
Doraemon_Image3.png
shubh/Doraemon_Image3.png
Media file
Doraemon_Image4.png
shubh/Doraemon_Image4.png
Media file
Doraemon_Image5.png
shubh/Doraemon_Image5.png
Media file
Doraemon_Image6.png
shubh/Doraemon_Image6.png
Media file
Image Cards.html
shubh/Image Cards.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Image Cards</title>
<style>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Image Cards</title>
<style>
BackgroundImage.png
shubh/BackgroundImage.png
Media file
OTP Generator.htm
shubh/OTP Generator.htm
Media file
OTP.css
shubh/OTP.css
body {
margin: 0;
padding: 0;
background: linear-gradient(120deg, rgb(10, 10, 208), rgb(246, 3, 3));
background-repeat: no-repeat;
background-size: cover;
height: 100vh;
margin: 0;
padding: 0;
background: linear-gradient(120deg, rgb(10, 10, 208), rgb(246, 3, 3));
background-repeat: no-repeat;
background-size: cover;
height: 100vh;
OTP.js
shubh/OTP.js
function generateOTP(){
let otp = " ";
let digits = "0123456789";
for(i=0;i<4;i++){
otp += digits [Math.floor(Math.random()*10)];
}
let otp = " ";
let digits = "0123456789";
for(i=0;i<4;i++){
otp += digits [Math.floor(Math.random()*10)];
}
semantic interpretation.ppt
shubh/semantic interpretation.ppt
Media file
bulb.html
shubh/bulb.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="bulb.css">
</head>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="bulb.css">
</head>
bulb.css
shubh/bulb.css
body{
background-color: black;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-color: black;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
Ractangle.html
shubh/Ractangle.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="Ractangle.css">
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="Ractangle.css">
Ractangle.css
shubh/Ractangle.css
*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
html,body{
width: 100%;
height: 100%;
margin: 0;
padding: 0;
box-sizing: border-box;
}
html,body{
width: 100%;
height: 100%;
Ractangle.js
shubh/Ractangle.js
let ract = document.querySelector("#ractangle");
ract.addEventListener("mousemove",function(details){
let ractloc = ract.getBoundingClientRect();
let insideractval = details.clientX - ractloc.left;
if (insideractval < ractloc.width/2){
let redColor = gsap.utils.mapRange(0,ractloc.width/2,255,0,insideractval);
gsap.to(ract ,{
backgroundColor: `rgb(${redColor},0,0)`,
ract.addEventListener("mousemove",function(details){
let ractloc = ract.getBoundingClientRect();
let insideractval = details.clientX - ractloc.left;
if (insideractval < ractloc.width/2){
let redColor = gsap.utils.mapRange(0,ractloc.width/2,255,0,insideractval);
gsap.to(ract ,{
backgroundColor: `rgb(${redColor},0,0)`,
cursoreffect.js
shubh/cursoreffect.js
window.addEventListener("mousemove", function(details){
let ract = this.document.querySelector(".ract");
let mouseval = gsap.utils.mapRange(0,window.innerWidth,100+ract.getBoundingClientRect().width/2,window.innerWidth-(100+ract.getBoundingClientRect().width/2),details.clientX)
gsap.to(".ract",{
left:mouseval,
ease:Power3,
});
});
let ract = this.document.querySelector(".ract");
let mouseval = gsap.utils.mapRange(0,window.innerWidth,100+ract.getBoundingClientRect().width/2,window.innerWidth-(100+ract.getBoundingClientRect().width/2),details.clientX)
gsap.to(".ract",{
left:mouseval,
ease:Power3,
});
});
cursoreffect.css
shubh/cursoreffect.css
*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
html,body{
width: 100%;
height: 100%;
margin: 0;
padding: 0;
box-sizing: border-box;
}
html,body{
width: 100%;
height: 100%;
Cursoreffect.html
shubh/Cursoreffect.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="cursoreffect.css">
</head>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="cursoreffect.css">
</head>
index.html
shubh/index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>ITintern</title>
<link rel="stylesheet" href="style.css" />
<head>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>ITintern</title>
<link rel="stylesheet" href="style.css" />
<head>
style.css
shubh/style.css
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html,
body {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html,
body {
script.js
shubh/script.js
sidenav = document.querySelector(".sidenav");
menuIcon = document.querySelector(".ri-menu-line");
navCloseBtn = document.querySelector(".ri-close-large-line");
menuIcon.addEventListener("click",()=>{
sidenav.style.display = "flex";
});
navCloseBtn.addEventListener("click",()=>{
menuIcon = document.querySelector(".ri-menu-line");
navCloseBtn = document.querySelector(".ri-close-large-line");
menuIcon.addEventListener("click",()=>{
sidenav.style.display = "flex";
});
navCloseBtn.addEventListener("click",()=>{
bk1.jpg
shubh/bk1.jpg
Media file
home.html
shubh/home.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>ITintern</title>
<link rel="stylesheet" href="home.css" />
<head>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>ITintern</title>
<link rel="stylesheet" href="home.css" />
<head>
home.css
shubh/home.css
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html,
body {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html,
body {
home.js
shubh/home.js
sidenav = document.querySelector(".sidenav");
menuIcon = document.querySelector(".ri-menu-line");
navCloseBtn = document.querySelector(".ri-close-large-line");
menuIcon.addEventListener("click",()=>{
sidenav.style.display = "flex";
});
navCloseBtn.addEventListener("click",()=>{
menuIcon = document.querySelector(".ri-menu-line");
navCloseBtn = document.querySelector(".ri-close-large-line");
menuIcon.addEventListener("click",()=>{
sidenav.style.display = "flex";
});
navCloseBtn.addEventListener("click",()=>{
about1.jpg
shubh/about1.jpg
Media file
about-1.jpg
shubh/about-1.jpg
Media file
App Development.jpg
shubh/App Development.jpg
Media file
bgimg.jpg
shubh/bgimg.jpg
Media file
contact1.jpg
shubh/contact1.jpg
Media file
System Design.jpg
shubh/System Design.jpg
Media file
Web Developer.jpg
shubh/Web Developer.jpg
Media file
Website.jpg
shubh/Website.jpg
Media file
about2.jpg
shubh/about2.jpg
Media file
annie-spratt-QckxruozjRg-unsplash.jpg
shubh/annie-spratt-QckxruozjRg-unsplash.jpg
Media file
App.jpg
shubh/App.jpg
Media file
certification-concept-illustration.png
shubh/certification-concept-illustration.png
Media file
courses-internship.css
shubh/courses-internship.css
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html,
body {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html,
body {
courses-intership.html
shubh/courses-intership.html
File is locked
jason-goodman-Oalh2MojUuk-unsplash.jpg
shubh/jason-goodman-Oalh2MojUuk-unsplash.jpg
Media file
shubh commented something @shubh/VID-20220908-WA0004.mp4
shubh commented something @shubh/VID-20220908-WA0004.mp4
shubh commented something @shubh/VID-20220908-WA0004.mp4
shubh commented something @shubh/VID-20220908-WA0004.mp4
shubh commented something @shubh/VID-20220908-WA0004.mp4
shubh commented something @shubh/VID-20220908-WA0004.mp4