STORE
.portfolio-gallery {
padding: 20px;
margin: 40px auto;
}
.portfolio-gallery ul {
display: flex;
margin-left:40px;
margin-bottom: 10px;
overflow: auto;
white-space: nowrap;
}
.portfolio-gallery ul::-webkit-scrollbar {
display: none;
}
.portfolio-gallery ul li {
list-style: none;
background: #EEE;
padding: 8px 20px;
margin: 2px;
letter-spacing: 1px;
cursor: pointer;
}
.portfolio-gallery ul li.active {
background: #8104FE;
color: #FFFFFF;
}
.portfolio-gallery .product {
display: flex;
flex-wrap: wrap;
}
.box{
display: grid;
grid-column-gap: 10px;
grid-row-gap: 120px;
}
.qt-item-block {
margin: 19px -255px -180px 55px;
}
.qt-item-bgimg {
position: relative;
z-index: 0;
}
.qt-item-img {
position: relative;
z-index: 1;
top: -30px;
left: -225px;
}
.qt-item-coinimg {
position: relative;
z-index: 1;
top: -69px;
left: 20%;
}
.qt-item-name {
position: relative;
z-index: 2;
top: -71px;
left: 8%;
font-size: 10px;
color: white;
white-space: pre-line;
}
.qt-item-coin {
position: relative;
z-index: 2;
top: -91px;
left: 26%;
font-size: 18px;
color: white;
}
$(document).ready(function(){
$('.list').click(function(){
const value = $(this).attr('data-filter');
if (value == 'all'){
$('.itemsbox').show('1000');
}
else {
$('.itemsbox').not('.'+value).hide('1000');
$('.itemsbox').filter('.'+value).show('1000');
}
})
//add active class on selected item
$('.list').click(function(){
$(this).addClass('active').siblings().removeClass('active');
})
})
$.getJSON( "https://quanback.uat.pumpkinvrar.com/api/mall", function( json ) {
var categoryGroup = ['head','skin','eyes','accessories','hands'];
// Dynamic Insert Code
for(index=0;indexjson[index].category.includes(substring));
if(!isContainCategory) continue;
if(json[index].coin1 != -1){
var imageUrl = getImageUrl(json[index]?.itemId);
var category = json[index]?.category.includes('eyes') ? "eyes":json[index]?.category;
var htmlTag = getItemHtmlModel(index, imageUrl, json[index]?.name, json[index]?.coin1, category);
$("#productContainer").append(htmlTag);
}
}
});
function getItemHtmlModel(id, imageUrl, itemName, itemPrice, itemCategory){
var htmlTag = '
- All
- Head
- Skin
- Eye&Ears
- Accessories
- Hands
'+
'
'+
'
'+
''+
'
';
console.log(itemCategory);
return htmlTag;
}
function getImageUrl(itemId){
return 'https://quantaar.com/wp-content/assets/file/image/mall/T_'+itemId?.substr(itemId?.length - 7)+'.png';
}
'+
''+
''+itemName+'
'+ '
'+
''+itemPrice+'
'+ 'FOLLOW QUANTAAR ON
