HTML/JS URI question

Dev Zone Code
1

This is kinda a noob question, but I am building a website and in one page I use a button to show/ hide some of the items on the page, like when I select projects it only shows the containers with the projects class, this code here:

 

$('#filter-buttons a').click(function(){

 
// select current
var $optionSet = $(this).parents('#filter-buttons');
   $optionSet.find('.selected').removeClass('selected');
   $(this).addClass('selected');
    
var selector = $(this).attr('data-filter');
$container.isotope({ filter: selector });
return false;
});

 

 

But I want to have links to this page like ...portfolio.html?projects,  ...portfolio.html?illustrations, ...... that when you load it loads with the URL it loads with the specific filter selected.

2

You would have to make portfolio.html a php file.  You would take the variables as GET variables through portfolio.php, and use them as such:

if (ISSET($_GET['projects'])){

} else if (ISSET($_GET['illustrations'])){

} // etc, etc

and inside that block you would perform the same class toggle in your .click() function, but instead your selector/function would be:

$('#filter-buttons a.projects').each(function(){});

Hope that makes sense, good luck!

 

(ps. just to shorten your code, all you actually have to do in each block is assign the selector to a variable and after the entire block, if the variable is not empty you can run the JS using that var so your class toggle js won't be repeated)