Jquery for Setting Fixed Up Html Block on page Scrolling

jQuery(function(){
 if (jQuery(".woodocs-toc").length > 0) {

  var top = jQuery('.woodocs-toc').offset().top - 140 - parseFloat(jQuery('.woodocs-toc').css('marginTop').replace(/auto/, 0));
  var toc_height = jQuery('.woodocs-toc').height();

  jQuery(window).scroll(function (event) {
   // what the y position of the scroll is
   var y = jQuery(this).scrollTop();
   var window_height = jQuery(window).height();
   var footer_top = jQuery('#footer').offset().top;

   if ( ( y + toc_height + 140 ) <= ( footer_top ) ) {
    jQuery('.woodocs-toc').fadeIn();
   } else {
    jQuery('.woodocs-toc').fadeOut();
   }

   if ( y >= top && toc_height < ( window_height - 140 ) ) {
    // if so, ad the fixed class
    jQuery('.woodocs-toc').addClass('fixed-toc');
   } else {
    // otherwise remove it
    jQuery('.woodocs-toc').removeClass('fixed-toc');
   }
  });
 }
});

Read More

Jquery event.preventDefault() vs. return false

return false from within a jQuery event handler is effectively the same as calling both e.preventDefault and e.stopPropagation on the passed jQuery.Event object.
 
e.preventDefault() will prevent the default event from occuring, e.stopPropagation() will prevent the event from bubbling up and return false will do both.

Read More

jQuery - How to Change Html of Particular Html Element like div,span,p etc..

How to Change Html of Particular Html Element like div,span,p etc..

I am wordpress developer working on Wordpress, Php Website since 5 Years. When I start Learning jQuery When I am fresher at that time I face so many problem. this is one problem that I had face out. Now a days also many developer facing same issue who does not know how to do it ? this post for only those people... 

Lets start It.. 

We have Html Code Like this 

<h3 class="comment-reply-title" id="reply-title">Leave a Reply </h3>

Wanted Like this

<h3 class="comment-reply-title" id="reply-title"><div style="font-style:normal;color:#0000FF;margin:0px 0px 10px;font-size:16px;font-weight:bold;">Add a comment</div></h3>

Solution :

<script type="text/javascript">

jQuery("#reply-title").html('<div style="font-style:normal;color:#0000FF;margin:0px 0px 10px;font-size:16px;font-weight:bold;">Add a comment</div>');

</script>

Read More