Archives

All posts for the year 2012

Example for smooth scrolling button(link) is in the bottom right corner of the page.

 

 

 

Html(link):

<div id="top-button" class="fixed-button">
<span><a href="javascript:void(null);">top &uarr;</a></span>
</div>
<div id="scroll-button" class="fixed-button">
<span><a href="javascript:void(null);">bottom &darr;</a></span>
</div>

Css:

.fixed-button {
background: none repeat scroll 0 0 #111111;
border: 1px dotted #444855;
color: #989eae;
bottom: 0;
right:2px;
font-size: 12px;
height: 15px;
padding: 10px;
position: fixed;
text-align: center;
width: 50px;
z-index: 800;
}

Javascript code:

$(document).ready(function()
{
   
   if($(window).height() < $('body').height())
   $('#scroll-button').show();
   $(window).scroll(function(){ smoothScroller(); });
   
   $('#top-button a').click(function(e){
      $('html, body').animate({scrollTop: '0px'}, 800);
      return false;
   });
   
   $('#scroll-button a').click(function(e){
      $('html, body').animate({scrollTop: $('body').height() + 'px'}, 800);
      return false;
   });
   var smoothScroller = function()
   {
   // get the height of #wrap
   var $wrapHeight = $('body').outerHeight()
   // get 1/4 of wrapHeight
   var $quarterwrapHeight = ($wrapHeight)/4
   // get 3/4 of wrapHeight
   var $threequarterswrapHeight = 3*($wrapHeight)
   // check if we're over a quarter down the page
   if( $(window).scrollTop() > $quarterwrapHeight )
   {
       $("#top-button").show();
       $("#scroll-button").hide();
   }
   else
   {
      $("#top-button").hide();
      $("#scroll-button").show();
   }
  }
 });

This is a list of WordPress plugins that I use in creating websites:

  • WP-PageNavi –  numeric pagination
  • Relevanssi -improved search engine
  • CKEditor For WordPress – replace poor defaut editor with CKEditor
  • W3 Total Cache – improve web site performance
  • Post Notification – for sending newsletters
  • Connections – advanced  contact list grouping by categories. Includes picture, main data(first name, middle name, last name etc.) ,address data(2 addresses, city, zip code, state), emails, phones(selecting types: work phone, cell phone, home phone, fax etc.), biography etc.

 Function for text width measure in pixels:

(function($) {
     $.fn.textWidth = function () {
     $body = $('body');
     $this =  $(this);
     $text = $this.text();
     if($text=='') $text = $this.val();
       var calc = '<div style="clear:both;display:block;visibility:hidden;"><span style="width;inherit;margin:0;font-family:'  + $this.css('font-family') + ';font-size:'  + $this.css('font-size') + ';font-weight:' + $this.css('font-weight') + '">' + $text + '</span></div>';
     $body.append(calc);
     var width = $('body').find('span:last').width();
      $body.find('span:last').parent().remove();
     return width;
    };
 })(jQuery);

Call of the function:

var $input = $(input_element_id);
var text_width =  $input.textWidth();
alert(text_width);

 

 

There are situations where one page contains multiple post queries(function query_posts) for different conditions(parent categories, tags, etc.), and some of post queries have custom filters(added by add_filter function). Next query_posts call will keep this custom filters, and that could make totaly unespected posts results. Before execute next post query, please add this kind of code to remove previous custom filter, i.e.:

if (has_filter('posts_where', 'filter_date_range_future')) remove_filter( 'posts_where', 'filter_date_range_future');

 'filter_date_range_future' is example function:

function filter_date_range_future($where = '') {
  $where .= " AND post_date >= '" . date('Y-m-d') . "'";
  return $where;
}