图像隐藏和显示不工作

我正在使用此jquery.smoothZoom.min.js来缩放和平移图像。我已经成功地应用到我的项目的单个图像，现在我想添加（<，>。即corousal），以便我可以将其用于多个图像。当我在custom.js中添加相应的部件时，它无法正常工作。图像隐藏和显示不工作

我将连接两个屏幕种类，这将清除画面

这是第一种情况 enter image description here

，然后点击右边corousal按钮

enter image description here 后

我只能看到背景但不是所需的图像。我不明白我错过了什么，

这HTML部分我一直在使用

<div class="image-display" id="displayplan4" style="width:70%;height:120%; left:39%;top:10%;position:absolute;display:none;"> 

     <img src="images/amenities.jpg" style="width:150%;height:130%; left:-60%;top:-20%;position:absolute;overflow:auto; z-index:1;"> 
     <div style="width:150%;height:130%; left:-60%;top:-20%;position:absolute;background:rgba(255,255,255,0.7);z-index:2;"> 
     </div> 

     <img class="planzoom" src="gallery/Residential/ongoing/Almog/Plan/almog1.jpg" id = "almogplan0" style="width:100%;height:100%; right:3%;top:50%;position:absolute;z-index:3;"> 
        <!--button for forward and backward movement--> 
      <a href="#" > <img src="innerimages/forward.gif" id="almogforward" style="position:absolute;height:3%;width:2%;z-index:3;top:25%;right:20%;"></a> 
      <a href="#" ><img src="innerimages/back.gif"  id="almogback" style="position:absolute;height:3%;width:2%;z-index:3;top:25%;left:0%;"></a> 
    </div>

和

<div id = "almogplandivII"> 
      <img class="planzoom" src="gallery/Residential/ongoing/Almog/Plan/almog2.jpg" id= "almogplan1" style="width:100%;height:100%; right:3%;top:50%;position:absolute;z-index:3;display:none;">  
     </div>

和相应的JS部分在显示和隐藏在鼠标单击图像图片。

var almog_plan_div=0; 

//Function for image forward with forward button 
$("#almogforward").click(function() 
{ 
    if(almog_plan_div<1) 
    { 
     $("#almogplan"+almog_plan_div).hide(); 
     almog_plan_div++; 
     $("#almogplan"+almog_plan_div).show(); 
    } 
    else 
    { 
     $("#almogplan"+almog_plan_div).hide(); 
     almog_plan_div=0; 
     $("#almogplan"+almog_plan_div).show(); 
    } 
}); 

//Function for image backward with backward button 
$("#almogback").click(function() 
{ 
    if(almog_plan_div>0) 
    { 
     $("#almogplan"+almog_plan_div).hide(); 
     almog_plan_div--; 
     $("#almogplan"+almog_plan_div).show(); 
    } 
    else 
    { 
     $("#almogplan"+almog_plan_div).hide(); 
     almog_plan_div=1; 
     $("#almogplan"+almog_plan_div).show(); 
    } 
});

我试图像加display:none样式属性，但它并不能帮助我的事业，对此有何帮助？

来源

2014-04-22 Sham

你有现场演示吗？ – Godinall

你的意思是像jsfiddle，我试过了，dint成功创建了 – Sham

yes或是一个实时网站预览 – Godinall

删除嵌入样式显示：img标签中没有，然后当您初始化页面时，然后使用hide（）函数隐藏该图像。

直列造型可能会重写此

来源

2014-04-22 06:55:13 Ishita

Ishita太原始了解您的解决方案可以üplz精确定位 – Sham

您有此代码：

...现在，从此标记中删除display：none，当您的页面加载或无论哪个第一个函数被调用以显示您的页面，写这一行$（“＃almogplan1”）。hide（）; – Ishita

@ ishita尝试了你的解决方案，它的不工作可能是我要求我隐藏$（“＃almogplanII”）。hide（）;我试过这也$（“＃almogplan1”）。hide（）; ，但无论如何它不工作 – Sham

由于双方你的答案，既ü可能不完全正确，但绝对帮助我让我我的解决方案。

诀窍我失踪：

I）使用了两种不同的div，但我没有定位在第二个，（我只注意到，当我试图在整个事件中一个新的网页，只有2它们的图像没有正确定位）我的需求需要divs被隐藏，我不得不隐藏它们。

2）我不得不删除的另一件事是从个人形象元素position:absolute事情。现在一旦纠正它凉爽。

来源

2014-04-23 09:39:28 Sham

图像隐藏和显示不工作

回答

相关问题