Unexpected token ILLEGAL in webkit

Question

// if the box is outside the window, move it to the end function checkEdge() {     var windowsLeftEdge = $('#window').position().left;      $('.box').each( function(i, box) {         // right edge of the sliding box         var boxRightEdge = $(box).position().left + $(box).width();          // position of last box + width + 10px         var newPosition = getNewPosition();          if ( parseFloat(boxRightEdge) < parseFloat(windowsLeftEdge) ) {              $(box).css('left', newPosition);             $(box).remove().appendTo('#window');             first = $('.box:first').attr('class');         }     }); }​ //Uncaught SyntaxError: Unexpected token ILLEGAL Occurs Here  // arrange the boxes to be aligned in a row function arrangeBoxes() {     $('.box').each( function(i, item) {         var position = $('#window').position().left + i * ( $(item).width());         $(item).css('left', position+'px')     }); }  // shifts all the boxes to the left, then checks if any left the window function shiftLeft() {     $('.box').animate({'left' : "-=100px"}, 5000, 'linear', checkEdge()); }  // returns the new location for the box that exited the window function getNewPosition() {     return $('.box:last').position().left + $('.box:last').outerWidth(); }  $(window).load(function() {       arrangeBoxes();     shiftLeft();     setInterval('shiftLeft()', 5000);      $('#gallery-slideshow').nivoSlider({         effect:'fade', //Specify sets like: 'fold,fade,sliceDown'         slices:15,         animSpeed:500, //Slide transition speed         pauseTime:3000,         startSlide:0, //Set starting Slide (0 index)         directionNav:true, //Next & Prev         directionNavHide:true, //Only show on hover         controlNav:false, //1,2,3...         keyboardNav:false, //Use left & right arrows         pauseOnHover:false, //Stop animation while hovering         manualAdvance:false, //Force manual transitions         captionOpacity:0, //Universal caption opacity         beforeChange: function(){},         afterChange: function(){},         slideshowEnd: function(){}, //Triggers after all slides have been shown         lastSlide: function(){}, //Triggers when last slide is shown         afterLoad: function(){} //Triggers when slider has loaded     });  });  $(document).ready(function(){      $('.class-table tr').click(function(){         window.location=$(this).find("a").attr("href"); return false;     });      $('.special-workshop').click(function(){         window.location=$(this).find("a").attr("href"); return false;     });  }); 

I am getting an Uncaught SyntaxError: Unexpected token ILLEGAL on the line mentioned above. It occurs only in Google Chrome and Safari. It works in Firefox and the same code works on this JSBin (http://jsbin.com/uceqi/18)

What is going on?

There are numerous references to this problem on Stackoverflow but none of them seem to apply to this situation.

If it helps JSLint also throws and error on that line character 2 "Problem at line 22 character 2: Unexpected '​'."

Answer 1

Delete all invisible characters (whitespace) around that area, then give it another try.

I've seen that error in Safari when copy/pasting code. You can pick up some invalid (and unfortunately invisible) characters.

Used to happen to me a lot when copying from jsFiddle.

Answer 2

It doesn't apply to this particular code example, but as Google food, since I got the same error message:

<script>document.write('<script src="…"></script>');</script> 

will give this error but

<script>document.write('<script src="…"><'+'/script>');</script> 

will not.

Further explanation here: Why split the <script> tag when writing it with document.write()?