WORKS

Coding with a commitment to pixel perfection.

I coded the landing page for the corporate site “Sample Corp.” as part of a school assignment. I did not handle the design aspect. Since it was a one-page design, I implemented anchor links in the top global menu, allowing users to navigate to each section. Additionally, I designed it so that users can return to the top at any time using a button placed at the bottom right.

The header on the top page of the website is designed with a color scheme and transparency that blends seamlessly with the background image. Upon scrolling down a bit, I utilized JavaScript (jQuery) to control the background opacity before it overlaps with the introductory text, enhancing readability.

Additionally, I expanded the clickable areas for each menu. By providing ample padding around the <a> tags enclosing the text, users can click in the surrounding space, ensuring a user-friendly experience even if the cursor doesn’t directly overlap with the text.

Slides using “Swiper.js”.

Implemented slides that extend beyond the right edge of the screen. Utilized the “Swiper.js” library for this purpose. Enabled slide navigation by clicking on pagination below the cards and added support for swipe gestures on smartphones when in smaller sizes.

A submit button that becomes clickable when certain conditions are met.

I coded the form implementation to enable the submit button functionality only when all required fields are filled in or checked. The button’s color changes from the initial state when the conditions are not met, providing visual cues to guide the user as they fulfill the necessary requirements.