Search the Community
Showing results for tags 'js'.
-
Hello, I have created an age limit in html css js and I would like to know where to put it so that it works. Thanks for all answer 😃
-
Site URL: https://seahorse-star-zkf7.squarespace.com/ Hello, Does anyone know how I can change the error messages on forms when it encounters an error? I'm trying to change the wording on the error message that pops up.
-
I am having issue targeting a gallery image item with JS.
Jake235 posted a question in Coding and Customization
<script> let imgs = document.querySelectorAll('section.page-section.gallery-section.full-bleed-section.background-width--full-bleed.section-height--medium.content-width--wide.horizontal-alignment--center img'); for (i= 0; i < imgs.length; i++) { alert("Hi!"); i++; } </script> <style>/* section.page-section.gallery-section.full-bleed-section.background-width--full-bleed.section-height--medium.content-width--wide.horizontal-alignment--center img { display: none !important;*/</style> This is the code that I am working with. I am trying to have it match to www.chicagofashioncoalition.org. I am able to get the images to disappear with the CSS that I have commented out, yet, Squarespace seems to edit out the javascript with the nodelist. Anyone have any ideas why Squarespace is not liking this particular line of JavaScript text? I've seen people able to manipulate, so, I know that it's possible. -
Does anyone know how to change the button text "Post Comment..." on blog commenting? I'm working with 7.1 for this particular site. I believe this has to be done via JS based on instructions I've seen for changing "Read More" text, etc. Thanks in advance! -
Site URL: https://blackcatdesign.co.th/ https://pagespeed.web.dev/report?url=https%3A%2F%2Fblackcatdesign.co.th%2F -
Site URL: https://jordandixon.co Here my site: https://jordandixon.co The issue is on mobile. I'd like to lock the screen orientation to portrait. If you turn your phone sideways on my current mobile site it looks bad. Any tips on how to do this with Javascript? I know there is an API for this but I'm unsure how to integrate it within Squarespace. I would appreciate any insight at all if anyone has come up with a similar solution. Thanks in advance!
-
Site URL: https://steven.squarespace.com/home-2 The WebGL background that I'm using lets you adjust the size of floating shapes. I currently have it set to 20. Is it possible to change the size, for example, to 10 for mobile only using CSS? Any help would be greatly appreciated. Thanks. -
Site URL: https://darganssb.com/ I'm making a new site for https://darganssb.com/. I'm trying to recreate the function of the "Open menu to order here" button. I was given this code: <span class="glf-button" data-glf-cuid="afa6fa14-ba69-41f2-9ad4-98b8404861f3" data-glf-ruid="90cec304-907d-42a9-9588-a1fb747e36d5"> See MENU & Order</span> <script src="https://www.fbgcdn.com/embedder/js/ewm2.js" defer async></script> But I don't know what to do with it. Can anyone help me out? Thanks in advance
-
member areas Targeting Membeship Area elements
senatorhayes posted a question in Coding and Customization
Hello, I need to target the main logo within the membership area only (a membership specific class I would imagine), in order to change the link out within the member area only with JS (it currently links out of this area and users get confused). However I cannot find a specific class on the body or anywhere that specifies that someone is currently logged in. Does anyone know of anyway to achieve this? What might be different when a user is logged in that I can target? Thanks -
Site URL: https://tympanus.net/codrops/2021/06/30/how-to-code-the-k72-marquee-hover-animation/ Hey guys! I have tried to follow the code on this attached website to make this marquee scrolling animation on codepen (https://codepen.io/madihasyed/pen/qBxBqGr) But I am not able to view the CSS elements properly, and I'm a complete newbie to Javascript so I have no idea how to import or attach the JS files to this code. Please let me know if there is something to be done from my side in order to achieve this effect! Thanks a TON ❤️
-
Site URL: https://dtmg.io Is there a way to add an onclick function to a button's href code? I've been googling and can't find anything. Thank you!
-
I'm looking to add the javascript & SVG effects shown in the following tutorials to my Squarespace 7.1 portfolio site: 1. "Making Stagger Reveal Animations for Text": https://tympanus.net/codrops/2020/06/17/making-stagger-reveal-animations-for-text 2. "Ideas for Distorted Link Effects on Menus": https://tympanus.net/Development/DistortedMenuLinkEffects/index5.html 3. "Animated Custom Cursor Effects": https://tympanus.net/Development/AnimatedCustomCursor/index3.html 4. "Text Distortion Effects using Blotter.js": https://tympanus.net/Development/TextDistortionEffects/index.html It looks like they require JS libraries such as Blotter.js, GSAP, Splitting.js, Paper.js, and Simplex Noise. A few are specifically about using SVG effects. And while I know a bit of HTML & CSS, these are all beyond me. One JS expert I know says the job isn't difficult — except that these require server-side code, and Squarespace won't allow that. He offered to move my site off Squarespace, which isn't an option, or recreate the effects with client-side code, but that would be way too expensive and might cause other issues like slowing down my site. Is he correct? Is there a solution? Thanks for looking. Adam -
Site URL: https://taranaomi.com/home Hi! Looking to understand and figure out how to code Locomotive scroll. I want my "Works" page to scroll through my portfolio pieces. The project titles will be links to external pages I have set up already. Here's what I'm hoping for: https://mathieulevesque.com/en Here's a couple of resources I've found online: https://codesandbox.io/s/b0c5t?file=/src/App.js:1092-1100 https://locomotivemtl.github.io/locomotive-scroll/ I've looked at YouTube resources and tried to play around with inspect element to see if I could figure it out but nothings worked so far. My site URL is taranaomi.com - any help would be appreciated, even just setting up the overlapping type and images. Thanks!
-
Site URL: https://codepen.io/dagerzuga/pen/KLOaqL Hi, was hoping to get some assistance formatting the shared CodePen reference to be used within a code block. Want to use it as header text for a page section area. Thank you in advance.
-
Hey all, I'm trying to get a script that would create a random image generator. A button on top, image display on the bottom. Ideally, the image would come from a Flickr gallery or a SS gallery that I create so I don't have to enter each address to an image in script. This one works great, but doesn't pull from a gallery. https://codepen.io/jsd041313/pen/RQEOWm Any ideas? -
Site URL: https://www.veteransthatdump.com/ Has anyone installed the CallTrackingMetrics tracking script using Code Injection and had it work? I see the script in the source code of the site but it is not sending info to CTM (according the CTM support) and SS isn't much help either. Mostly just trying to see if anyone else has been able to get it to work or might have an idea why it would not be working. Thanks in advance.
-
Site URL: https://walrus-bellflower-k256.squarespace.com/ I've tried a number of ways. It seems the page loads fully on the initial render, as the scrollbar indicates, but I can only seem to get the height of the element that my JS code is inside of, and not the whole document itself. I'm building a scroll-progress-bar for a client and need to know how much of the document they've scrolled through. I thought I might be able to get the footer element and measure the distance from there, but that's also undefined. This was my latest attempt, using all the possible document.height attributes I could find haha, but still nothing: const body = document.body const html = document.documentElement const h = Math.max( body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight ) still only returns 589, but the document scrolls to 4715
-
Parallax script which was previously working is now buggy
apinrise posted a question in Coding and Customization
Site URL: http://www.allkings.org We had been successfully using the code shared here in this tutorial: https://www.launchthedamnthing.com/blog/use-parallax-in-squarespace-71 Until last weekend, we hadn't made any changes to the site and suddenly the parallax is off, and the layers are overlapping. I've disabled the script for now, but wondering if there may have been an update to 7.1 that would have changed things? We're still on that same version, and the tutorial is there to match it, but the problem is there. -
Hide Promotional Pop-up after 5 second interval
bountydigital posted a question in Coding and Customization
Hi! I was wondering how to hide the close button on the promotional pop-up, and instead have the pop-up fadeout after 5 seconds? Thanks! -
Hola everyone! I have a plugin (javascript) that launches a pop over box. I am having trouble either styling the script or adding the script to a button. Here is the script. Trying to make it look like the button above in the screen grab <script src="https://www.riskalyze.com/hosted/v2/0a1d6c37ef7ffe925794/rq/lt/lg/btn.js" type="text/javascript" data-button-color="#ff8949" data-button-title="TAKE OUR INVESTMENT RISK TOLERANCE QUESTIONNAIRE"> </script> Any help would be appreciated. Cheers, Alex
-
Changing Animation on Scroll Per Block/Section
leaflotus posted a question in Coding and Customization
Hey, How do we change the animation effects on different elements, I have site wide animation but I want different animations for different blocks or sections. For example, having one block slide in from the right, and another block from the left, then the section after doing a fade up. Thanks! -
Site URL: https://www.wroteon.com/tester I am trying to inject the code from this article into my own site using a code block. In trying to combine the codes into one and change it to h3 text, I tried the below code, which give the result you can currently see with the dark grey background (please ignore the typewriter effect on the text in the lower section as that is a different approach I am wanting to avoid using): <h3 id="check"> I am <span id="typewriter"></span> </h3> <script> let data = ["Text1", "Text2","Text3","Text4"]; let len = 0; let speed=150; for (let i = 0; i < data.length; ++i) len += 2*data[i].length; len += 4*data.length; function type() { let p=0; for (let i = 0; i < data.length; ++i) { let x = 0; while (x <= data[i].length) { let y=x; setTimeout(()=>{ document.getElementById('typewriter').innerHTML=`${data[i].substr(0,y)}` },p*speed) ++x,++p; } --x,p+=2; while (x >= 0) { let y=x; setTimeout(()=>{ document.getElementById('typewriter').innerHTML=`${data[i].substr(0,y)}` },p*speed) --x,++p; } } setTimeout(() => { type(); }, len * speed); } function blinkingPointer(){ setTimeout(()=>{ document.getElementById('check').style.borderRightColor=`red`; },500) setTimeout(()=>{ document.getElementById('check').style.borderRightColor='transparent' },1000) setTimeout(()=>{ blinkingPointer(); },1000) } blinkingPointer(); type(); #check{ margin:2px auto; width: fit-content; border-right: 1px solid; } </script> I have a feeling this has more to do with how I am injecting the code rather than the code itself. Thanks for any help you can give!
-
Hi, I have 2 images overlay. I want to trigger a sound by clicking on the upper image (olaf.gif) I have sound on image but I lose all criteria: size olaf.gif, onClick and onMouseOut on 5.png. Thank you for your help. Voizins <script> function play(){ var audio = document.getElementById("audio"); audio.play(); } </script> <td align="center" valign="middle"><img src="Images/olaf.gif" value="PLAY" onclick="play()"> <audio id="audio" src="Sound/TOON.wav" ></audio> width="100" height="75" alt="" onClick="this.src='Images/5.png';" onMouseOut="this.src='Images/5.png' /></td>
-
Site URL: https://geckovacations.squarespace.com/ Password: 12345 on the Home Page there is some code for a property search widget. It doesn't show up when the site is live nor in edit mode in Squarespace 7.0 but works fine when I tested it on a 7.1 template. Attached is the error shown. Can anybody please tell me exactly what to do? I am not a coding expert. -
Emulate any of these webflow elements in Squarespace?
David_Ledger posted a question in Coding and Customization
Site URL: https://thefutur.com/brand-strategy-fundamentals#scroll-text1 Wondering if anyone knows how to pick this apart and create something similar in Squarespace. What is needed? Javascript, CSS, HTML Combination? Not even sure where to start, any thoughts would be helpful to get me started. I believe they built this in Webflow.1 Thank you, https://thefutur.com/brand-strategy-fundamentals#scroll-text1
