1

我说我在这方面真的是新手,但我试图学习一些东西,我被困在这个事实上。

从技术上讲,当我点击它时,我只是无法隐藏这个“homebox”。这个盒子上的“点击”功能应该打开一个画廊......但打开它后,它也应该隐藏起来。为什么?因为盒子实际上在较低的 z-index 中包含了一张图片,而画廊的图片在较高的 z-index 上,所以我只显示了 2 张图片,真的很难看。

<div id="homebox">
             <a href="img/gallery/Home/Harris-Wharf-London-man-01.jpg" rel="gallery" class="pirobox_gall16">
                         <img src="../400x550 man.png" border="0"/>
          </a>
            <?PHP
                $sql_foto = "SELECT * FROM foto WHERE idMenu = '16' ORDER BY nomeFile ASC";
                $query_foto = mysql_query($sql_foto);
                while($fetch_foto = mysql_fetch_array($query_foto))
                {
                    $foto = $fetch_foto['nomeFile']; 

                    ?>
                    <a href="img/gallery/ID16/<?PHP echo $foto;?>" rel="gallery" class="pirobox_gall16">
                    </a>
                <?PHP
                    }

            ?>
        </div>

我正在尝试这个脚本来制作这个,但正如我所说,我正在尝试学习制作比经典 html 网站更酷的东西,但我认为提问始终是提高你能力的好方法。

$('#homebox').click(function() {
  $('#homebox').css('visibility', 'visible') 
});

提前感谢任何建设性的答复!

4

5 回答 5

0

请尝试此代码...

$('#homebox').click(function() {
  $(this).hide();
});

或者

$('#homebox').click(function() {
      $(this).SlideUp();
    });
于 2013-01-11T09:32:07.240 回答
0

尝试

$('#homebox').click(function() {
  $('#homebox').css("display", "none");
});
于 2013-01-11T09:36:05.907 回答
0

请使用以下代码

  $('#homebox').click(function() {
      $(this).hide(); 
    });
于 2013-01-11T09:32:14.453 回答
0

添加hidden类也是一个好习惯。这样在浏览 DOM 时,您可以轻松查看元素具有的状态:

$('#homebox').click(function() {
    $(this).toggleClass('hidden');
});

然后在你的 CSS 中:

.hidden { display: none; visibility: hidden; }
于 2013-01-11T09:39:22.130 回答
0

您应该尝试为您的图片库设置单独的控件。您不能使用元素本身来切换元素的可见性或显示。一旦它是visibility: hidden;display:none;它不会触发点击事件,并且在这种情况下display: none甚至不会出现在文档流中(尽管它会保留在 DOM 中)。

我的建议是添加一个画廊触发元素,例如

<a href="#" id="gallery-trigger">View Gallery</a>

然后你可以向这个元素添加一个点击事件来切换你的画廊的可见性。

document.ready(function() {
     $('#gallery-trigger').click(function() {
         $('.homebox').toggle();
     });
});

http://jsfiddle.net/3leven11/h6YtJ/

于 2013-01-11T10:20:07.450 回答