Jump to content

stop script stretching text on click

Go to solution Solved by creedon,

Recommended Posts

Site URL: https://raspberry-garlic-8h62.squarespace.com/

Hi everyone, 

I am testing a script to see if i can implement on squarespace  - but I need it to stop stretching on click.  I'm a beginner at JS and cant figure out how to make the action stop when you click.   Any help would be greatly appreciated! 

@creedon @tuanphan

Site PW: stretch 

Here's the JS 

// stretch text 

var originalWidth = $("h1").width()
var originalHeight = $("h1").height()

$(document).on("mousemove", function (event){
	
	var scaleX = event.pageX / originalWidth
	var scaleY = event.pageY / originalHeight
	
	$("h1").css("transform","scale("+ scaleX +","+ scaleY +")")
	
})
Link to comment
  • Replies 2
  • Views 203
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

  • Solution

Add something like the following to your code.

$(document).click(function (){
    
    $( this ).off ( 'mousemove' );
    
})

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.