CODEWITHSUNDEEP
jqueryfilterhide
Kennen Lasuni
Kennen Lasuni

Reputation: 67

Hide images onload contained in a select filter

http://jsfiddle.net/DH8HQ/1/

    function itemInSpot(drag_item,spot)
{
var oldSpotItem = $(spot).find('img');
if(oldSpotItem.length>100) {
    oldSpotItem.appendTo('#itembox4').draggable({ revert: 'invalid' });
}
var item = $('<img />');
item.attr('src',drag_item.attr('src')).attr('class',drag_item.attr('class')).appendTo(spot).draggable({ revert: 'invalid' });
drag_item.remove(); // remove the old object
}

 $(document).ready(function() {
$("img").draggable({ revert: 'invalid'});

$("#itembox4").droppable()
$("#pricebox").droppable({ accept: '.price'})
$('#pricebox').droppable({ accept: '.price'});
$('#pricebox,#pricebox,#itembox4').bind('drop', function(ev,ui) {  itemInSpot(ui.draggable,this); });

$('#clone_button').click(function() {
    $('#clone_wrapper div:#pricebox')
        .clone()
        .append('')
        .appendTo($('#clone_wrapper'));
})
});
$('#filter').change(function(){
    $('#itembox4 img').hide();
    $('#'+$(this).val()).show();
});

At the moment when you load all the images in the Inventory box #itembox4 show. I need to change this because once its complete there will be over 800 images contained in the box. Currently when the page loads the filter option displays 'select' but none of the images have a class of 'select'.

So my question is
How do I make all the images hide until a filter option is selected via the dropdown menu.

Upvotes: 0

Views: 102

Answers (1)

Anujith
Anujith

Reputation: 9370

Like this:

 $('#itembox4 img').hide();

See http://jsfiddle.net/DH8HQ/2/

Upvotes: 2

Related Questions