Equal Div Height with JQuery

jQuery, Wordpress, , , Leave a comment

jQuery is a fast solution if you need support on your  HTML layout. Having an issue to keep your divs in an equal height? Check out this cool and easy script to keep your divs in an equal height: jQuery Match Height Plugin.

If you are on WordPress, you can try this simple line on ‘functions.php’ file:

function add_custom_script() {
	wp_enqueue_script( 'match-height', 'https://cdnjs.cloudflare.com/ajax/libs/jquery.matchHeight/0.7.0/jquery.matchHeight-min.js', array('jquery'));
}
add_action( 'wp_enqueue_scripts', 'add_custom_script' );

Call the function on header or footer:

function inject_script() {
	echo <<< EOT
		<script type="text/javascript">
		jQuery(document).ready(function(){
			jQuery('.map .column-4').matchHeight();
		});
		</script>
	EOT;
}
add_action('wp_footer', 'inject_script');

Or you can simply use a plugin to add the codes above.

 

JQuery Rename Attribute Function

jQueryLeave a comment

JQuery currently not support ability for Attribute renaming. Well, I’m not quite handy with Javascript, so I searched the net, and found a generous people sharing his code:

[javascript]
jQuery.fn.extend({
renameAttr: function( name, newName, removeData ) {
var val;
return this.each(function() {
val = jQuery.attr( this, name );
jQuery.attr( this, newName, val );
jQuery.removeAttr( this, name );
// remove original data
if (removeData !== false){
jQuery.removeData( this, name.replace(‘data-‘,”) );
}
});
}
});
[/javascript]

Here’s how to use it:
[js]
// $(selector).renameAttr(original-attr, new-attr, removeData);

// removeData flag is true by default
$(‘#test’).renameAttr(‘data-test’, ‘data-new’ );

// removeData flag set to false will not remove the
// .data("test") value
$(‘#test’).renameAttr(‘data-test’, ‘data-new’, false );
[/js]

Code From Wowmotty