Oct 15, 2019
Back to all Elements
Before starting this little project, you'll need these 2 things:
1. Rename all your sequence files to numbers 0 - 10 (or as high as you need)
2. Upload all the files to the same folder. Copy+Paste to a note the folder path and the 1st file path.
3. Go to your Custom Code tab in the project settings.
In the end of the <head> tag section add the <link id="favicon...> line. Edit the href link to your 1st file path (see in the code section below).
4. In the before </body> tag section paste the rest of the code (from <script> to the </script> including)
Edit the 'http://your-folder-path' to your sequence folder path (keep the apostrophes)
5. Change the 'faviconIndex %' (in my code 7) to the number of sequence files you have)
6. And last thing - change the timing between each file. In my code it's 3000 (3 sec.)
<link id="favicon" rel="shortcut icon" href="http://1st-file-path/fav-seq0.png" type="image/x-icon">
<script>
window.onload = function() {
var faviconIndex = 0;
var favicon = document.getElementById('favicon');
setInterval(function() {
favicon.href = 'http://your-folder-path/' + faviconIndex + ".png";
faviconIndex++;
faviconIndex %= 7;
}, 3000);
};
</script>
The videos Kurzgesagt channel creates are so beautifully animated, that I almost forget that I learn so much while watching them!
Convert the Workspaces dropdown to an open sidebar with custom order.
A (custom code) solution that combines CSS variables and Vanilla JavaScript for the shrinking / growing of browser top & bottom bars.
.png)
Change Webflow's Slider to act as a "regular" grid block on desktop, but go back to Slider on Tablet and smaller screens.
.png)
