Modify JavaScript to access variable

Question

I'm playing around with some code which enlarges text based on the size of the div it's in. It can be seen here:

$(function() {

  var outer = $('div'), inner = $('h1'),
  difference = outer.width()-inner.width(),
  ratio = outer.width()/inner.width(),
  style = 'translateX(' + difference/2 + 'px) ' + 'scale(' + ratio + ')';
  inner.css({'webkit-transform': style, transform: style});
});

However, I'm trying to modify it to use a variable with sizes in, not get it from the div. This was my attempt that doesn't seem to work:

$(function() {

  var width = "400",
  var inner = $('h1'),
  difference = width -inner.width(),
  ratio = width /inner.width(),
  style = 'translateX(' + difference/2 + 'px) ' + 'scale(' + ratio + ')';
  inner.css({'webkit-transform': style, transform: style});
});

Max Klein · Accepted Answer · 2017-03-03 16:57:02Z

1

You have to replace the comma (',') after var width = "400" with a semicolon. Your current code throws a syntax error.

The corrected code would be:

$(function() {

  var width = "400"; // <-----
  var inner = $('h1'),
  difference = width -inner.width(),
  ratio = width /inner.width(),
  style = 'translateX(' + difference/2 + 'px) ' + 'scale(' + ratio + ')';
  inner.css({'webkit-transform': style, transform: style});
});

answered Mar 3, 2017 at 16:57

Max Klein

5281 gold badge7 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Jimmy Over a year ago

Thank you. May I just ask why that is, since the other var has a comma and is ok?

Max Klein Over a year ago

@Jimmy The reason is that the lines after the second var statement all belong to the preceding var. This is the same as e.g. var a = 1, b = 2, c = 3;, just broken up into multiple lines. It is always a good idea to indent variable declarations, this makes the code much easier to read and to understand.

Collectives™ on Stack Overflow

Modify JavaScript to access variable

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related