blogger template with grid/list view

bobi236

New Member
This code displays a grid full of items in the case of my blog it displays a grid view full of images and titles of my blog posts, on the top of the grid I have two buttons "Grid" that displays the items as a grid or List that displays them as the normal posts list. the default mode is "Grid" and I want to change it to "List so when the users first visit my website see the posts as a list. Please Help me!!!This is my blog: Awesome Thrillers\[code\]jQuery(document).ready(function(){var $box=jQuery('.post'),$bar=jQuery('a.bar_view');$dat=jQuery('a.dat_view');$dat.click(function(){$box.removeClass("bar");jQuery(this).addClass('active');$bar.removeClass('active');jQuery.cookie('dat_style',0);return false});$bar.click(function(){$box.addClass("bar");jQuery(this).addClass('active');$dat.removeClass('active');jQuery.cookie('dat_style',1);return false});if(jQuery.cookie('dat_style')==0){$box.removeClass("bar");$dat.addClass('active')}else{$box.addClass("bar");$bar.addClass('active')}});\[/code\]\[quote\] This is the Html buttons\[/quote\]\[code\]<a class='bar_view' href='http://stackoverflow.com/questions/13781867/#'>Grid</a> <a class='dat_view' href='http://stackoverflow.com/questions/13781867/#'>List</a>\[/code\]\[quote\] This is the styles:\[/quote\]a.bar_view{background:url(http://2.bp.blogspot.com/-7BeF7FZiHo0/T6vZzVSzTzI/AAAAAAAABJs/FlrWN7ZRxmk/s1600/drid.gif) no-repeat 3px center} a.dat_view{background:url(http://1.bp.blogspot.com/-43EW3Gjakwc/T6vZz6K4N_I/AAAAAAAABJ0/hi2LK0zc4JQ/s1600/listed.gif) no-repeat 3px center}
 
Back
Top