octavia0914
KPCKevin Powell - Community
•Created by octavia0914 on 7/22/2024 in #front-end
2 "fixed" sections causing gap
and it worked. Thanks man.
7 replies
KPCKevin Powell - Community
•Created by octavia0914 on 7/22/2024 in #front-end
2 "fixed" sections causing gap
*Universal *{margin: 0;}
7 replies
KPCKevin Powell - Community
•Created by octavia0914 on 7/22/2024 in #front-end
2 "fixed" sections causing gap
You were right, it was margin. 3 hours later and I found out that on a section on my website I was doing margin-top, and I took off margin on that area and it worked, and then I came back and did the universal *{
7 replies
KPCKevin Powell - Community
•Created by octavia0914 on 7/22/2024 in #front-end
2 "fixed" sections causing gap
if you edit the #navbar in css, to position="relative" that is exactly what I want
7 replies
KPCKevin Powell - Community
•Created by octavia0914 on 7/21/2024 in #front-end
Animate on scroll
Thank you, for taking your time and responding.
12 replies
KPCKevin Powell - Community
•Created by octavia0914 on 7/21/2024 in #front-end
Animate on scroll
12 replies
KPCKevin Powell - Community
•Created by octavia0914 on 7/21/2024 in #front-end
Animate on scroll
const scrollElements = document.querySelectorAll(".js-scroll");
const elementInView = (el, dividend = 1) => {
const elementTop = el.getBoundingClientRect().top;
return (
elementTop <=
(window.innerHeight document.documentElement.clientHeight) / dividend
);
};
const elementOutofView = (el) => {
const elementTop = el.getBoundingClientRect().top;
return (
elementTop > (window.innerHeight document.documentElement.clientHeight)
);
};
const displayScrollElement = (element) => {
element.classList.add("scrolled");
};
const hideScrollElement = (element) => {
element.classList.remove("scrolled");
};
const handleScrollAnimation = () => {
scrollElements.forEach((el) => {
if (elementInView(el, 1.25)) {
displayScrollElement(el);
} else if (elementOutofView(el)) {
hideScrollElement(el)
}
})
}
window.addEventListener("scroll", () => {
handleScrollAnimation();
});
12 replies
KPCKevin Powell - Community
•Created by octavia0914 on 7/21/2024 in #front-end
Animate on scroll
Thanks. Im taking this Js
12 replies
KPCKevin Powell - Community
•Created by octavia0914 on 7/21/2024 in #front-end
Animate on scroll
I was just hoping for a little bit of Vanilla Javascript, Thanks
12 replies
KPCKevin Powell - Community
•Created by octavia0914 on 7/21/2024 in #front-end
Animate on scroll
I think you guys are too advanced for me. I've seen scroll-timeline and know that it's not supported anywhere, and I don't know what polyfill is so I googled it, and it just saying javascript code to falll back on, if not supported?
12 replies
KPCKevin Powell - Community
•Created by octavia0914 on 7/21/2024 in #front-end
Animate on scroll
*many not all, but many.
12 replies
KPCKevin Powell - Community
•Created by octavia0914 on 7/21/2024 in #front-end
Animate on scroll
Thank you Zach, unfortunately it's not support on any browser. https://caniuse.com/?search=scroll-timeline
12 replies
KPCKevin Powell - Community
•Created by octavia0914 on 7/14/2024 in #front-end
"how to stop the "fixed" background image from overflowing into other sections
I appreciate that, thank you.
4 replies
KPCKevin Powell - Community
•Created by octavia0914 on 6/3/2024 in #front-end
Border only in corners
I appreciate the help
8 replies
KPCKevin Powell - Community
•Created by octavia0914 on 6/3/2024 in #front-end
Border only in corners
Thank you guys.
8 replies
KPCKevin Powell - Community
•Created by octavia0914 on 4/6/2024 in #front-end
Iphone safari search in the way
Vmax worked lol. I thought that was going to be a lot harder, Thank you.
4 replies
KPCKevin Powell - Community
•Created by octavia0914 on 4/2/2024 in #front-end
background scrolling when menu is open
ok thank you
3 replies
KPCKevin Powell - Community
•Created by octavia0914 on 3/24/2024 in #front-end
image rendering blur when scaling.
ok thank you. i did think of that to be fair and not use all your time, that why I deleted it and make a new post. thanks.
13 replies
KPCKevin Powell - Community
•Created by octavia0914 on 3/24/2024 in #front-end
image rendering blur when scaling.
yeah Ill just do another transition. thanks.
13 replies
KPCKevin Powell - Community
•Created by octavia0914 on 3/22/2024 in #front-end
Forms for websites.
Thank you, both. I think I’ll do the plug and play one, thank you for suggesting php too.
4 replies