<link rel="stylesheet" type="text/css" href="catalog/view/theme/default/stylesheet/category_pro.css" />
<!--[if IE 9]>
<link rel="stylesheet" type="text/css" href="catalog/view/theme/default/stylesheet/category_pro_ie9.css" />
<![endif]-->
<!--[if IE 8]>
<link rel="stylesheet" type="text/css" href="catalog/view/theme/default/stylesheet/category_pro_ie8.css" />
<![endif]-->
<!--[if lt IE 8]>
<link rel="stylesheet" type="text/css" href="catalog/view/theme/default/stylesheet/category_pro_ie7.css" />
<![endif]-->
<script type="text/javascript">
$(document).ready(function(){
$(".category_pro_exprand").toggle(
function() {
$(this).next('.level-2').slideToggle("slow"),{
duration: 'slow',
easing: 'easeOutBounce'
};
},
function() {
$(this).next('.level-2').slideToggle("slow"),{
duration: 'slow',
easing: 'easeOutBounce'
};
}
);
$('.category_pro_info').each(function() {
var tip = $(this).find('.category_pro_information');
$(this).hover(
function() { tip.appendTo('body'); },
function() { tip.appendTo(this); }
).mousemove(function(e) {
var x = e.pageX + 60,
y = e.pageY - 40,
w = tip.width(),
h = tip.height(),
dx = $(window).width() - (x + w),
dy = $(window).height() - (y + h);
if ( dx < 50 ) x = e.pageX - w - 60;
if ( dy < 50 ) y = e.pageY - h + 50;
tip.css({ left: x, top: y });
});
});
});
</script>
<div class="box">
<div class="box-heading"><?php echo $heading_title; ?></div>
<div class="box-content">
<div class="box-category">
<ul>
<?php foreach ($categories as $category) { ?>
<?php if ($category['category_id'] == $category_id) { ?>
<li class="active">
<?php } else { ?>
<li>
<?php } ?>
<?php if ($category['category_id'] == $category_id) { ?>
<a class="active"><?php echo $category['name']; ?></a>
<div class="category_pro_info">
<div class="category_pro_information" style="height: <?php echo $box_height; ?>px; width: <?php echo $box_width; ?>px;">
<?php if ($category['thumb']) { ?>
<div class="category_pro_image"><img src="<?php echo $category['thumb']; ?>"></div>
<?php } else { ?>
<div class="category_pro_image"><img src="<?php echo $category['no_image']; ?>"></div>
<?php } ?>
<div class="category_pro_name"><?php echo $category['name']; ?></div><br />
<div class="category_pro_description"><?php echo $category['description']; ?></div>
</div>
</div>
<?php } else { ?>
<a href="<?php echo $category['href']; ?>" class="no-active"><?php echo $category['name']; ?></a>
<div class="category_pro_info">
<div class="category_pro_information" style="height: <?php echo $box_height; ?>px; width: <?php echo $box_width; ?>px;">
<?php if ($category['thumb']) { ?>
<div class="category_pro_image"><img src="<?php echo $category['thumb']; ?>"></div>
<?php } else { ?>
<div class="category_pro_image"><img src="<?php echo $category['no_image']; ?>"></div>
<?php } ?>
<div class="category_pro_name"><?php echo $category['name']; ?></div><br />
<div class="category_pro_description"><?php echo $category['description']; ?></div>
</div>
</div>
<?php } ?>
<?php if ($category['children']) { ?><span class="category_pro_exprand"></span>
<ul class="level-2">
<?php foreach ($category['children'] as $child) { ?>
<?php if ($child['category_id'] == $child_id) { ?>
<li class="active">
<?php } else { ?>
<li>
<?php } ?>
<?php if ($child['category_id'] == $child_id) { ?>
<a class="child-active">- <?php echo $child['name']; ?></a>
<div class="category_pro_info">
<div class="category_pro_information" style="height: <?php echo $box_height; ?>px; width: <?php echo $box_width; ?>px;">
<?php if ($child['child_thumb']) { ?>
<div class="category_pro_image"><img src="<?php echo $child['child_thumb']; ?>"></div>
<?php } else { ?>
<div class="category_pro_image"><img src="<?php echo $child['child_no_image']; ?>"></div>
<?php } ?>
<div class="category_pro_name"><?php echo $child['name']; ?></div><br />
<div class="category_pro_description"><?php echo $child['descr_child']; ?></div>
</div>
</div>
<?php } else { ?>
<a href="<?php echo $child['href']; ?>">- <?php echo $child['name']; ?></a>
<div class="category_pro_info">
<div class="category_pro_information" style="height: <?php echo $box_height; ?>px; width: <?php echo $box_width; ?>px;">
<?php if ($child['child_thumb']) { ?>
<div class="category_pro_image"><img src="<?php echo $child['child_thumb']; ?>"></div>
<?php } else { ?>
<div class="category_pro_image"><img src="<?php echo $child['child_no_image']; ?>"></div>
<?php } ?>
<div class="category_pro_name"><?php echo $child['name']; ?></div><br />
<div class="category_pro_description"><?php echo $child['descr_child']; ?></div>
</div>
</div>
<?php } ?>
</li>
<?php } ?>
</ul>
<?php } ?>
</li>
<?php } ?>
</ul>
</div>
</div>
</div>
