Let's .focus()


#1

Stuck on the Let's focus exercise. It says I passed but the outline color is still blue. I even matched it up to the template in the hint. I don't know what I'm doing wrong.

$(document).ready(function(){
    $('input').focus(function(){
        $(this).css('outline-color', '#FF0000');
    });
});

#2

I just ran your code its showing red, Try refreshing the page and see.

Otherwise paste in your HTML & CSS as well


#4

I just went back to the lesson and tried it again and it's still blue for me. Here is my HTML and CSS. It may just be a bug on the site. Just wanted to make sure my code wasn't wrong.

<!DOCTYPE html>
<html>
    <head>
		<title>Time to Focus!</title>
		<link rel='stylesheet' type='text/css' href='stylesheet.css'/>
		<script type='text/javascript' src='script.js'></script>
	</head>
	<body>
		<form>
			Name: <input type='text' name='name'></input>
		</form>
	</body>
</html>

input {
    font-family: Verdana, Arial, Sans-Serif;
}

#5

So I just tried it in a different browser and it works. There must be some issue with the site on safari. I've noticed other strange behavior as well when doing animations like slide and bounce. You can tell they're working but the original object stays in place (so it's like there are two objects, one bouncing and one staying still).


#6

You might be using firefox or some other browser.Use this code and you will see i added a extra line.

$(document).ready(function(){

$('input').focus(function(){

    $('input').css("outline-style","solid");
    $('input').css("outline-color","#FF0000");

    });

});

#7

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.