Javascript

Use jQuery to do something to a DIV when the user clicks outside of it

Sometimes you wanna do something such as when you click a div a part that you hide, shown and when click outside of if you wanna hide again . Following code do what exactly you want.

        $(document).mouseup(function (e) {

            var container = $("your_selector");
       
            if (!container.is(e.target) // if the target of the click isn't the container...
                && container.has(e.target).length === 0) // ... nor a descendant of the container
            {
                // do something you want (hide,show,remove, change class anything you want) Ex: container.hide()
               
            }
        });

Don’t scroll whole page while scrolling

-View-

<html>
  <head>
     <title>Title here</title>
  </head>
  <body>
      <div id="navbar" style="position:fixed;"></div>
      <div id="content>
      <div id="leftColumn"></div>
      <div id="centerColumn"></div>
      <div id="rightColumn"></div>    
  </div>
  </body>
</html>

-Javascript-

    $(window).scroll(function () {
        var scrollTop = $(window).scrollTop();
        if (scrollTop > 0)
            $('#leftColumn, #rightColumn').css('margin-top', scrollTop);
        else
            $('#leftColumn, #rightColumn').css('margin-top', scrollTop);
    });

P.S. Use this code if you just want to scroll center of the page Not left not right content just scroll center content of the page.

Textarea enter submit

<html lang="eng">
	<head>
		<title> Index Page </title>
		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
		<script type"text/javascript">
		$(function(){
		$('#txtMessage').focus();
		
		$('#txtMessage').keydown(function(event){
		
		if(event.keyCode==13 && event.shiftKey) return;
		
		if(event.keyCode==13){
		var messageBody=$('#txtMessage').val();
		$('<p/>').html(messageBody).appendTo($('#content'));
		$('#txtMessage').val('').focus();
		event.preventDefault();
		}
		
		});
		
		});
		</script>
	</head>
	<body>

	<hr/>
	<hr/>
	
	<textarea id="txtMessage" col="50" rows="5" placeholder="Enter your message"></textarea>
	
	<div id="content" style="white-space:pre"></div>

	</body>
</html>

This script shows textarea enter submit , shift+enter is new line key also after submit shows place holder message again.