Link problem in a filterable menu WordPress

guillaume guillaume comments:

Thanks but I doesn't change. The result is online.

Arnav Joy comments:

ok try this , i am not sure if it work or not .

if it also does not works then i have to work on your files as the js which is applied to the filtering is not letting you redirect that



<div id="afp-container">';


//Start Echo Categories



$output.='<ul id="afp-filter">



<li class="afp-active-cat"><a href="#" class="All">All</a></li><li class="afp-active-cat"><a href="http://www.katiakrylova.com/text/" target="_self">Text</a></li>';


foreach ( $cats as $cat ){





$link = get_category_link($cat->term_id);

$output.='<li><a onclick="call_me('.$link.')" href="'.$link.'" class="' . ereg_replace("[^A-Za-z0-9]", "", $cat->cat_name) . '">' . $cat->cat_name . '</a></li>';







}



$output.='</ul>';



//End Echo Categories







//Start Echo Portfolio Items



$output.='<ul class="afp-items">';



$k = 1;



foreach ($items as $item ){



$output.='<li class="afp-single-item" data-id="id-' . $k . '" data-type="' . ereg_replace("[^A-Za-z0-9]", "", $item->item_category) .'">



<a class="fancybox" title="' . $item->item_description . '" href="' . $item->item_image . '"><img alt="" class="img-link-initial" src="' . $item->item_thumbnail . '"></a><br />



<ul class="afp-item-details">';



if($item->item_title != null) { $output.='<li>' . $item->item_title . '</li>'; }



if($item->item_client != null) { $output.='<li>' . $item->item_client . '</li>'; }



if($item->item_date != '0000-00-00') { $output.='<li>' . date("m/d/Y", strtotime($item->item_date)) . '</li>'; }



if($item->item_link != null) { $output.='<li><a target="_' . $afpOptions['project_link'] . '" href="' . $item->item_link . '">Project Link</a></li>'; }



$output.='</ul>



</li>';







$k++;



}



$output.='</ul>





</div>



<script>
function call_me( url ){
location.href = url;
}
</script>



guillaume guillaume comments:

Nop, do you need the js ?
Please see below



jQuery(document).ready(function($) {



// get the action filter option item on page load

var $filterType = $('#afp-filter li.afp-active-cat a').attr('class');



// get and assign the afp-items element to the

// $holder varible for use later

var $holder = $('ul.afp-items');



// clone all items within the pre-assigned $holder element

var $data = $holder.clone();



// attempt to call Quicksand when a filter option

// item is clicked

$('#afp-filter li a').click(function(e) {

// reset the active class on all the buttons

$('#afp-filter li').removeClass('afp-active-cat');



// assign the class of the clicked filter option

// element to our $filterType variable

var $filterType = $(this).attr('class');

$(this).parent().addClass('afp-active-cat');



if ($filterType == 'All') {

// assign all li items to the $filteredData var when

// the 'All' filter option is clicked

var $filteredData = $data.find('li[data-type]');

}

else {

// find all li elements that have our required $filterType

// values for the data-type element

var $filteredData = $data.find('li[data-type=' + $filterType + ']');

}



// call quicksand and assign transition parameters

$holder.quicksand($filteredData, {

duration: dur,

easing: afp_easing

});

return false;

});

});

jQuery(document).ready(function($) {



/*-- FANCYBOX --*/

/*

maxWidth : 800,

maxHeight : 600,

type : 'ajax',

*/

$(".fancybox").fancybox({

maxWidth : 1000,

maxHeight : 800,

fitToView : false,

width : '85%',

height : '85%',

autoSize : false,

closeClick : false,

openEffect : 'none',

closeEffect : 'none'

});

});





Arnav Joy comments:

try this

jQuery(document).ready(function($) {







// get the action filter option item on page load



var $filterType = $('#afp-filter li.afp-active-cat a').attr('class');







// get and assign the afp-items element to the



// $holder varible for use later



var $holder = $('ul.afp-items');







// clone all items within the pre-assigned $holder element



var $data = $holder.clone();







// attempt to call Quicksand when a filter option



// item is clicked



$('#afp-filter li a').click(function(e) {



// reset the active class on all the buttons



$('#afp-filter li').removeClass('afp-active-cat');







// assign the class of the clicked filter option



// element to our $filterType variable



var $filterType = $(this).attr('class');



$(this).parent().addClass('afp-active-cat');







if ($filterType == 'All') {



// assign all li items to the $filteredData var when



// the 'All' filter option is clicked



var $filteredData = $data.find('li[data-type]');



}



else {

location.href = $(this).attr('href');



// find all li elements that have our required $filterType



// values for the data-type element



var $filteredData = $data.find('li[data-type=' + $filterType + ']');



}







// call quicksand and assign transition parameters



$holder.quicksand($filteredData, {



duration: dur,



easing: afp_easing



});



return false;



});



});



jQuery(document).ready(function($) {







/*-- FANCYBOX --*/



/*



maxWidth : 800,



maxHeight : 600,



type : 'ajax',



*/



$(".fancybox").fancybox({



maxWidth : 1000,



maxHeight : 800,



fitToView : false,



width : '85%',



height : '85%',



autoSize : false,



closeClick : false,



openEffect : 'none',



closeEffect : 'none'



});



});



guillaume guillaume comments:

Result is online but act strange.
See before the page is redirected.

Arnav Joy comments:

try this js

jQuery(document).ready(function($) {







// get the action filter option item on page load



var $filterType = $('#afp-filter li.afp-active-cat a').attr('class');







// get and assign the afp-items element to the



// $holder varible for use later



var $holder = $('ul.afp-items');







// clone all items within the pre-assigned $holder element



var $data = $holder.clone();







// attempt to call Quicksand when a filter option



// item is clicked



$('#afp-filter li a').click(function(e) {

if ( $(this).attr('class') != 'All')
location.href = $(this).attr('href');

// reset the active class on all the buttons



$('#afp-filter li').removeClass('afp-active-cat');







// assign the class of the clicked filter option



// element to our $filterType variable



var $filterType = $(this).attr('class');



$(this).parent().addClass('afp-active-cat');







if ($filterType == 'All') {



// assign all li items to the $filteredData var when



// the 'All' filter option is clicked



var $filteredData = $data.find('li[data-type]');



}



else {

location.href = $(this).attr('href');



// find all li elements that have our required $filterType



// values for the data-type element



var $filteredData = $data.find('li[data-type=' + $filterType + ']');



}







// call quicksand and assign transition parameters



$holder.quicksand($filteredData, {



duration: dur,



easing: afp_easing



});



return false;



});



});



jQuery(document).ready(function($) {







/*-- FANCYBOX --*/



/*



maxWidth : 800,



maxHeight : 600,



type : 'ajax',



*/



$(".fancybox").fancybox({



maxWidth : 1000,



maxHeight : 800,



fitToView : false,



width : '85%',



height : '85%',



autoSize : false,



closeClick : false,



openEffect : 'none',



closeEffect : 'none'



});



});



guillaume guillaume comments:

same thing, it seems the link is first redirected inside the page and then to the asked url.
any idea why ?

guillaume guillaume comments:

OK I manage it.
Thanks for the help.

Arnav Joy comments:

Cam you vote now