//isotope filter
jQuery(document).ready(function() {
var $container = $('.isotope-filter');
$container.isotope({
itemSelector : '.single-isotope-filter'
});
//relayout
setInterval(function(){
$container.isotope('reLayout');
}, 0);
//reLayout
var $optionSets = $('#options .option-set'),
$optionLinks = $optionSets.find('a');
$optionLinks.click(function(){
var $this = $(this);
// don't proceed if already selected
if ( $this.hasClass('selected') ) {
return false;
}
var $optionSet = $this.parents('.option-set');
$optionSet.find('.selected').removeClass('selected');
$this.addClass('selected');
// make option object dynamically, i.e. { filter: '.my-filter-class' }
var options = {},
key = $optionSet.attr('data-option-key'),
value = $this.attr('data-option-value');
// parse 'false' as false boolean
value = value === 'false' ? false : value;
options[ key ] = value;
if ( key === 'layoutMode' && typeof changeLayoutMode === 'function' ) {
// changes in layout modes need extra logic
changeLayoutMode( $this, options )
} else {
// otherwise, apply new options
$container.isotope( options );
}
return false;
});
});
//end isotope filter
Content of first tab
<div class="single-isotope-filter filterone">content</div>
Content of second tab
<div class="single-isotope-filter filtertwo">content</div>
Content of third tab
<div class="single-isotope-filter filterthree">content</div>
When I load the page all three contents are displayed. I want it to display just item1 content when i load the page. Can anyone help.
Perhaps something along these lines is what you're looking for? You can just throw this right under the $(document).ready() function. (non-JQuery version)
var divs = document.getElementsByClassName('single-isotope-filter');
for (var i=1; i<divs.length; i++) {
divs[i].style.visibility = 'hidden';
}
Or just simply set the visibility with CSS:
div.filtertwo,div.filterthree {
visibility: hidden;
}
Among these methods, there are all kinds of ways you can do this.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.