Creating a sticky and transparent header for Wix or WordPress websites often requires the integration of some external codes. Follow the steps below to create a very appealing sticky and transparent header for a Wix website.

Step1: From the header scroll setting settings select “Freezes”
Step2: Enable Dev Mode on your backend.

Step3: Create 2 headers and give them the IDs Header1 (Default Header), and Header2 (The scrolling Header). Set the default value for Header2 as hidden, since that’s the scrolling header.

Step3: Create a classic strip below the header, give it the ID “Trans” Means header transition point, and check the button to show it on all pages
Step4: Go to Home Page Codes and add the below codes as you see them.
$w.onReady(function () {
// Write your JavaScript here
// To select an element by ID use: $w('#elementID')
// Click 'Preview' to run your code
$w("#trans").onViewportLeave(() => {
$w("#Header2").show();
$w("#Header1").hide();
})
$w("#trans").onViewportEnter(() => {
$w("#Header1").show();
$w("#Header2").hide();
})
});
Step5: Save and publish your site.
1 thought on “Create Sticky and Transparent Header on Wix Website”
Check out 1this guide on how to get diamonds in cooking fever for free
gddd23jas
This game is more fun when you have unlimited diamonds.If you like phone games like this you need to check out this link