Webflow Preview Link for FTMSS Ultra Awesome Site

·Sep 09, 2024 01:38 PM

only read link : https://preview.webflow.com/preview/ftmss-ultra-awesome-site?utm_medium=preview_link&u[…]e&preview=b262d815fb7de7e07110e64ae0cfd85c&workflow=preview

5 comments

· Sorted by Oldest

Matt J.
·
I would use ChatGPT to generate some custom JS for this.
I have a long paragraph that I want to split into two using a read more link that when it is clicked, reveal the rest of the paragraph. Write this using vanilla javascript, css and html
the reason I don't just generate the code for you is 1) it would need some setup, which would take some time and 2) I like to teach people how to fish, instead of catching their fish for them. 😉 Let me know how you go with this!
❤️1
Matt J.
·
btw, I actually ran this prompt into ChatGPT and it generated some pretty decent results without testing the code.
🔥1
Valentin L.
·
<style> a { cursor: pointer; } a:hover { text-decoration: underline; } </style> <div> <p> Google Ads (anciennement Google Adwords) est le premier canal d’acquisition digital pour générer du trafic qualifié. <span id="moreText" style="display: none; opacity: 0; transition: opacity 0.3s;"> En tant qu’agence Google Ads Partner, AdsBack combine expertise et une approche innovante des Ads pour vous créer des campagnes publicitaires à la pointe qui maximiseront votre retour sur investissement et vous assureront des performances optimales. </span> <span id="ellipsis">... </span> <a href="#" id="readMoreLink" onclick="toggleText()"> (voir plus)</a> </p> </div> <script> function toggleText() { var moreText = document.getElementById("moreText"); var readMoreLink = document.getElementById("readMoreLink"); var ellipsis = document.getElementById("ellipsis"); if (moreText.style.display === "none") { moreText.style.display = "inline"; setTimeout(function() { moreText.style.opacity = "1"; }, 10); ellipsis.style.display = "none"; // Cacher les ... readMoreLink.innerHTML = " (voir moins)"; } else { moreText.style.opacity = "0"; setTimeout(function() { moreText.style.display = "none"; }, 300); ellipsis.style.display = "inline"; // Réafficher les ... readMoreLink.innerHTML = " (voir plus)"; } } </script>
Valentin L.
·
https://ftmss-ultra-awesome-site.webflow.io/
Valentin L.
·
result is good ! 😲

Webflow Preview Link for FTMSS Ultra Awesome Site | Relume Community

Matt J.
·
I would use ChatGPT to generate some custom JS for this.
I have a long paragraph that I want to split into two using a read more link that when it is clicked, reveal the rest of the paragraph. Write this using vanilla javascript, css and html
the reason I don't just generate the code for you is 1) it would need some setup, which would take some time and 2) I like to teach people how to fish, instead of catching their fish for them. 😉 Let me know how you go with this!
❤️1
Matt J.
·
btw, I actually ran this prompt into ChatGPT and it generated some pretty decent results without testing the code.
🔥1
Valentin L.
·
<style> a { cursor: pointer; } a:hover { text-decoration: underline; } </style> <div> <p> Google Ads (anciennement Google Adwords) est le premier canal d’acquisition digital pour générer du trafic qualifié. <span id="moreText" style="display: none; opacity: 0; transition: opacity 0.3s;"> En tant qu’agence Google Ads Partner, AdsBack combine expertise et une approche innovante des Ads pour vous créer des campagnes publicitaires à la pointe qui maximiseront votre retour sur investissement et vous assureront des performances optimales. </span> <span id="ellipsis">... </span> <a href="#" id="readMoreLink" onclick="toggleText()"> (voir plus)</a> </p> </div> <script> function toggleText() { var moreText = document.getElementById("moreText"); var readMoreLink = document.getElementById("readMoreLink"); var ellipsis = document.getElementById("ellipsis"); if (moreText.style.display === "none") { moreText.style.display = "inline"; setTimeout(function() { moreText.style.opacity = "1"; }, 10); ellipsis.style.display = "none"; // Cacher les ... readMoreLink.innerHTML = " (voir moins)"; } else { moreText.style.opacity = "0"; setTimeout(function() { moreText.style.display = "none"; }, 300); ellipsis.style.display = "inline"; // Réafficher les ... readMoreLink.innerHTML = " (voir plus)"; } } </script>
Valentin L.
·
https://ftmss-ultra-awesome-site.webflow.io/
Valentin L.
·
result is good ! 😲