Position positioning within the loop_html/css_WEB-ITnose

This post was last edited by wangruixi on 2013-03-16 17:04:34

I encountered such a problem, and I want to implement the method introduced on the page below. On the detail page of a single product, this function is implemented very well.
http://hi.baidu.com/gyfcw/item/5193c2f357586c1f84d278d9

But here comes the problem. On the classified product list page, multiple products are displayed in a circular list; each product display includes an "Add to Cart" button. My purpose is to click the "Add to Cart" button of any product to pop up a confirmation window in the corresponding location. But no matter which product I add to the list, the pop-up window appears at the position of the first product, which means that all pop-up windows seem to have the first product as the parent element.

Please give me some advice, thank you!


...
                                                 > //The pop-up window contains the position:absolute attribute
                                                                                                                                                                     $lang.btn_buy}" style="margin:4px auto;"/>

                                               foreach}-->

Reply to discussion (solution)

Does anyone know? ? ?

It depends on how your addToCart function implements the pop-up window.

弹出窗口的实现代码如下，我是参考这个链接实现的。在单个商品详细页只显示一个商品信息的时候弹出窗口的定位没问题。但是在分类商品的列表页当列出多个商品“加入购物篮”时（PHP代码是通过foreach循环实现），弹出窗口总是定位到了第一个商品的位置。
http://hi.baidu.com/gyfcw/item/5193c2f357586c1f84d278d9


/* *
* 点击购物后弹出提示层 
* 参数 cartinfo：购物车信息 
*/
function openDiv_ecshop120(cartinfo) 
{
  var _id = "speDiv";
  var m = "mask";
  if (docEle(_id)) document.removeChild(docEle(_id));
  if (docEle(m)) document.removeChild(docEle(m));
  //计算上卷元素值
  var scrollPos; 
  if (typeof window.pageYOffset != 'undefined') 
  { 
    scrollPos = window.pageYOffset; 
  } 
  else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat') 
  { 
    scrollPos = document.documentElement.scrollTop; 
  } 
  else if (typeof document.body != 'undefined') 
  { 
    scrollPos = document.body.scrollTop; 
  }

  var i = 0;
  var sel_obj = document.getElementsByTagName('select');
  while (sel_obj[i])
  {
    sel_obj[i].style.visibility = "hidden";
    i++;
  }

  // 新激活图层
  var newDiv = document.createElement("div");
  newDiv.id = _id;
  newDiv.style.position = "absolute";
  newDiv.style.zIndex = "10000";
  newDiv.style.width = "289px";
  newDiv.style.height = "120px";
  newDiv.style.top = "-120px";
  newDiv.style.left = "1px"; 
  newDiv.style.overflow = "hidden"; 
  newDiv.style.background = "#FFF";
  newDiv.style.border = "0px solid #59B0FF";
  newDiv.style.padding = "0px";

  //生成层内内容
        newDiv.innerHTML = '

';
  newDiv.innerHTML += '

 该商品已成功放入购物车
'+cartinfo +'
  

';
document.getElementById('gwc').appendChild(newDiv);



}

The pop-up layer is always bound to the one with the id of gwc In the container, if there are multiple containers with the same ID on a page, how do you think the browser can distinguish them? So I think we should add parameters to js to distinguish each container.