JQuery Simple Add remove class on mouse click

Simple CSS add remove classes with JQuery

<script>
$('#register').click(function() {
$('#boxcontt').addClass("slideOut");
$('#boxcontt').removeClass("slideDown");
$('#regform').addClass("slideDown");
$('#regform').removeClass("slideOut");
$('#forgetform').removeClass("slideDown");
});
</script>

Getting random background colors with JQuery

JQuery getting random background colors with CSS

<script>
                $(document).ready(function() {
                    window.setInterval(function() {
                        $(".tile5").each(function() {
                            $(this).css("background", get_random_color());
                        });
                    }, 3000);
                    window.setInterval(function() {
                        $(".tile12").each(function() {
                            $(this).css("background", get_random_color());
                        });
                    }, 4000);
                });

                function get_random_color() {
                    var letters = '0123456789ABCDEF'.split('');
                    var color = '#';
                    for (var i = 0; i < 6; i++) {
                        //  color += letters[Math.round(Math.random() * 15)];
                        color += letters[Math.round(Math.random() * 15)];
                    }
                    return color;
                }
</script>

Move Background Image on Hover mouse move

Move Background image X Y axis on mouse move or hove on a div or entire body and html page (Simple Parallax)

<script>
        $('html,body').mousemove(function(e){
    var amountMovedX = (e.pageX * -1 / 5);
    var amountMovedY = (e.pageY * -1 / 1000);
    $(this).css('background-position', amountMovedX + 'px ' + amountMovedY + 'px');
});
</script>

Simple scrollorama alternative

Simple scrollorama alternative with Jquery and CSS 3 Animations for Biginners and everyone with add and remove classes

<script type="text/javascript">
(function($) {
  $.fn.visible = function(partial) {
    
      var $t            = $(this),
          $w            = $(window),
          viewTop       = $w.scrollTop(),
          viewBottom    = viewTop + $w.height(),
          _top          = $t.offset().top,
          _bottom       = _top + $t.height(),
          compareTop    = partial === true ? _bottom : _top,
          compareBottom = partial === true ? _top : _bottom;
    
    return

((compareBottom <= viewBottom) && (compareTop >= viewTop));
  };
    
})(jQuery);
$(window).scroll(function(event) {
if($("#mobidien").css("display") == "none"){
  
  $(".grid_4").each(function(i, el) {
    var el = $(el);
    if (el.visible(true)) {
      el.addClass("fadeIn"); 
    } 
 else{
 el.removeClass("fadeIn"); 
 }
  });
  
  $(".rightx").each(function(i, el) {
    var el = $(el);
    if (el.visible(true)) {
      el.addClass("fadeIn"); 
    } 
 else{
 el.removeClass("fadeIn"); 
 }
  });  
}});
  </script>

JQuery Back to top - Scroll to top

JQuery Back to top - Scroll to top code

<script>
$(document).ready(function(){
 // hide #back-top first
 $("#back-top").hide(); 
 // fade in #back-top
 $(function () {
  $(window).scroll(function () {
   if ($(this).scrollTop() > 100) {
    $('#back-top').fadeIn();
   } else {
    $('#back-top').fadeOut();
   }
  });
  // scroll body to 0px on click
  $('#back-top a').click(function () {
   $('body,html').animate({
    scrollTop: 0
   }, 800);
   return false;
  });
 });
});
</script>