Pages

Tuesday, February 15, 2011

jQuery Plugin - article box

<script>
/**
 * @name    : article box
 * @author  : irfanudin ridho
 * @email   : irfan.ub@gmail.com
 * @version : 2.0
 * @date    : February 15, 2011
 *
 * The format of the html content is like this
 * <div>
 *  <h3>Title</h3>
 *  <p>Content you want to add</p>
 * </div>
 */

(function($){
    $.fn.shadow = function(){
        $(this).addClass('jq-base').addClass('jq-box');
        $(this).find('h3').addClass('jq-base').addClass('jq-h3');
        $(this).find('p').addClass('jq-base').addClass('jq-p');

        return this;
    };
})(jQuery);

</script>

<style>
.jq-base { margin: 0px; }
.jq-box { border: 1px solid #aaa; padding: 10px; 
          -moz-box-shadow: 0 0 2px #aaa; -moz-border-radius: 4px;
          font-family: sans-serif; }
.jq-h3 { font-size: 14px; padding: 0 0 5px; }
.jq-p { font-size: 12px; color: #444; }
</style>

No comments:

Post a Comment