Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- let imageContainer = document.querySelector('.hero.container-fluid');
- let imageContainer2 = document.querySelector('#rings-bottom');
- let dropdownn = document.querySelector('.jump-menu-container.animate__animated.animate__fadeIn');
- // create new image element
- let eikona = document.createElement("img");
- eikona.id = "eikona";
- //eikona.style.clipPath = "polygon(0 0, 100% 0, 100% 100%, 0 100%)";
- eikona.src = "https://i.postimg.cc/gjWv3Bpt/hero-new-img.png";
- eikona.style.height = "auto";
- eikona.style.position = "absolute";
- eikona.style.right = "0";
- eikona.style.zIndex = "2";
- // animation
- eikona.style.animation = "float 6s ease-in-out infinite";
- //eikona.style.boxShadow = "0 5px 15px 0px rgba(0,0,0,0.6)";
- eikona.style.transform = "translatey(0px)";
- // css
- let keyframes = `
- @keyframes float {
- 0% {
- /*box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6);*/
- transform: translatey(0px);
- }
- 50% {
- /*box-shadow: 0 25px 15px 0px rgba(0,0,0,0.2);*/
- transform: translatey(-20px);
- }
- 100% {
- /*box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6);*/
- transform: translatey(0px);
- }
- }
- @media only screen and (min-width: 1930px){
- #eikona {
- top: 270px;
- width: 45%;
- }
- }
- @media only screen and (max-width: 1920px){
- #eikona {
- top: 283px;
- width: 45%;
- }
- }
- @media only screen and (max-width: 1600px){
- #eikona {
- top: 300px;
- width: 45%;
- }
- }
- @media only screen and (max-width: 1440px){
- #eikona {
- top: 335px;
- width: 45%;
- }
- }
- @media only screen and (max-width: 1366px){
- #eikona {
- top: 368px;
- width: 45%;
- }
- }
- @media only screen and (max-width: 1280px){
- #eikona {
- top: 390px;
- width: 45%;
- }
- }
- @media only screen and (max-width: 1100px){
- #eikona {
- top: 464px;
- width: 45%;
- }
- }
- @media only screen and (max-width: 990px){
- #eikona {
- top: 520px;
- width: 45%;
- }
- }
- @media only screen and (max-width: 900px){
- #eikona {
- top: 550px;
- width: 45%;
- }
- }
- @media only screen and (max-width: 830px){
- #eikona {
- top: 567px;
- width: 45%;
- }
- }
- @media only screen and (max-width: 768px){
- #eikona {
- top: 250px;
- width: 45%;
- }
- }
- @media only screen and (max-width: 600px){
- #eikona {
- top: 230px;
- width: 60%;
- }
- }
- `
- let style = document.createElement("style");
- style.innerHTML = keyframes;
- document.head.appendChild(style);
- imageContainer.appendChild(eikona);
- // hide the old backgrounds
- imageContainer.style.backgroundImage = "none";
- imageContainer2.style.backgroundImage = "none";
- dropdownn.style.zIndex = "3";
- document.querySelector("body > div.dots-bg > div > div > div > div.center-vertical.col-md-6 > div.jump-menu-container.animate__animated.animate__fadeIn > span > span.selection > span").style.backgroundColor = "#ffffff00";
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement