pinterest jquery图片库无法正常显示

Question

由于jquery冲突，我在另一个jquery选项卡部分（Js代码A）下显示一组pinterest jquery图像效果（Js代码B）时遇到问题，当我删除js代码时，js代码B工作我是否使两个jquery效果工作没有任何冲突。如果有人可以在这里提供帮助，我将不胜感激。非常感谢。

<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>

Js Code A从这里开始

/删除以下代码将启用效果 /

<script type="text/javascript">
$(document).ready(function() {

//Default Action
$(".tab_content").hide(); //Hide all content
$("ul.tabs li:first").addClass("active").show(); //Activate first tab
$(".tab_content:first").show(); //Show first tab content

//On Click Event
$("ul.tabs li").click(function() {
    $("ul.tabs li").removeClass("active"); //Remove any "active" class
    $(this).addClass("active"); //Add "active" class to selected tab
    $(".tab_content").hide(); //Hide all tab content
    var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content
    $(activeTab).fadeIn(); //Fade in the active content
    return false;
});

});

</script>

/删除代码将启用效果 /

Js Code A end here

Js代码B从这里开始

<script type="text/javascript">

$.fn.extend(
{
boxify: function(i)
{
var j = $(this),
  e = j.children("figure"),
  i = i ||
  {},
  k = i.background || "#fff",
  a = i["border-color"] || "#bbb",
  m = i.color || "#000",
  g = i.margin && +i.margin.replace(/px$/, "") || 6,
  l = i.padding && +i.padding.replace(/px$/, "") || 10,
  f = i.width && +i.width.replace(/px$/, "") || 220,
  c = j.innerWidth(),
  b = (c % (f + g)),
  h = (c - b) / (f + g),
  d = [];
  j.css(
  {
  margin: g / 2 + "px " + b / 2 + "px",
  position: "relative"
  });
  e.each(function(n, o)
  {
  var p = $(o);
  p.css(
  {
    background: p.data("background") || k,
    color: p.data("color") || m,
    borderWidth: 1,
    borderStyle: "solid",
    borderColor: p.data("border-color") || a,
    boxSizing: "border-box",
    margin: g / 2,
    padding: l,
    position: "absolute",
    top: n >= h ? d[n - h] : 0,
    left: (f + g) * Math.round(n % h),
    width: f
  });
  p.find("img").width(f - (l * 2) - 2);
  d.push(p.outerHeight() + g + p.position().top)
  })
  }
  });



$(window).load(function() {
        $('#boxy').boxify({width: "220px"});
    });
</script>

Js Code B在这里结束

<div class="con">
    <ul class="tabs">
      <li class="tabb">
        <a href="#tab1">Company</a>
      </li>

      <li>
        <a href="#tab2">Website</a>
      </li>

      <li>
        <a href="#tab3">Product</a>
      </li>
    </ul>


<div class="tab_con" >
      <div class="tab_content" id="tab1">
        <h2>Company</h2>

        <div id="companybox">

        </div>
      </div>


      <div class="tab_content" id="tab2">
        <h2>Website</h2>


      </div>


      <div class="tab_content" id="tab3">
        <h2>Product</h2>

      <div id="productbox">

      <div id="boxy">

     <?php
     $sql1 = mysql_query ("SELECT * FROM upload WHERE email = '$user_check' And cat='product'   ");

     while ($row = mysql_fetch_array($sql1))
     {
     $finalname = $row['picname'];
       $description = $row['description'];
            $cname = $row['name'];   
            $address=$row['address'];  
            $id = $row['id']; 


     ?>

     <figure> 

     <img src="folio/<?php echo $finalname ?>" >

     <figcaption>
     <h4><?php echo $cname ?></h4>
     <p><?php echo $description ?></p>
     </figcaption>

     </figure>

     <?php
     }

     ?>
    </div>     
    </div>        
    </div>
  </div>
  </div>