/ Published in: jQuery
Expand |
Embed | Plain Text
Copy this code and paste it in your HTML
$(document).ready(function(){ // -- FILTER BY BRAND // Hide all product info $(".view-picked-products .views-row").hide(); // Click a brand name $(".view-picked-products h3").click(function() { // First hide any other expanded brands within the type (ie, Fridge) $(this).parent().find(".views-row").hide(); // Then show the three product divs applicable to brand $(this).next().show(); // First div $(this).next().next().show(); // Second div $(this).next().next().next().show(); // Third div }); // -- FILTER BY PRODUCT // Hide all product info (except for the serial number) $(".view-picked-products .views-row > div:not(.views-field-field-serialnumber-value)").hide(); // Click a product's serial number $(".view-picked-products .views-field-field-serialnumber-value").click(function() { // First, hide any other expanded products within the type (ie, Fridge) $(this).parent().parent().find(".views-row > div:not(.views-field-field-serialnumber-value)").hide(); // Then show the four extra product details $(this).next().show(); // "Cost" $(this).next().next().show(); // "RRP" $(this).next().next().next().show(); // "Water rating" $(this).next().next().next().next().show(); // "Energy rating" // Lastly, stop the link from going to another page return false; }); });