Javascript CSS3-制作一个简单的点击下拉列表

有人能帮我做与本页相同的下拉列表的代码吗

我想做同样的东西，完全一样的东西

因此我得到了它背后的CSS，例如，

#PresentationContainer

.Pointer

.PointerContent

但是，我似乎无法使下拉具有向下滑动的效果

此外，我似乎无法使文本和图片在单击框时显示在下拉列表中。这里面有php吗

---

提前感谢：）

看起来该站点正在使用Jquery执行交互和动画。你可以这样做：

$('#button_id').on('click', clickButton);    
function clickButton()
{
  $(this).stop().slideToggle();
}

其中

按钮\u id

是用户将要单击的页面上元素的id

有关jquery slideToggle的更多信息：

$（函数（）{
$（“#PresentationContainer h3”）。单击（函数（）{
//检查此演示文稿是否已准备就绪？
bIsOpen=$（“.PointerContent”，$（this.parent（））.css（“display”）==“block”；
$（“#PresentationContainer.PointerContent”）.slideUp（）；
//打开当前指针内容
如果（！biopen）
{
$（“.PointerContent”，$（this.parent（））.slideDown（“fast”）；
}
});
//使用标记将lightbox区域中的所有图像包裹起来
$（“#PresentationContainer.GalleryContainer img”）。每个（函数（）{
oLink=document.createElement（“a”）；
oLink.href=$（this.attr（“src”）；
if（$（this.attr（“title”）！=null）
{
oLink.title=$（this.attr（“title”）；
}
$（此）.wrap（oLink）；
});
$（“#PresentationContainer a[rel='lightbox']”）。单击（函数（e）{
$（“.GalleryContainer a”，$（this.parent（））.lightBox（{
固定导航：正确，
imageLoading:“/static/lib/lightbox/images/lightbox ico-load.gif”，
imageBtnClose:“/static/lib/lightbox/images/lightbox btn close.gif”，
imageBtnPrev:“/static/lib/lightbox/images/lightbox btn prev.gif”，
imageBtnNext:“/static/lib/lightbox/images/lightbox btn next.gif”
} );
$（“.GalleryContainer a:first”，$（this.parent（））.trigger（“单击”）；
e、 预防默认值（）；
});
});

---

这是一段用于实现此效果的代码，还可以添加必要的jquery文件以正确工作

jquery！链接到jquery的一个版本并添加如下所示的代码

$('.yourClicker').click(function() { 
    $('.yourMenu').slideToggle(); 
    return false;
});

其中。单击器是单击事件的触发器。菜单是要折叠和展开的元素的类。在下面拉小提琴：

---

没有PHP参与这种效果，他们正在使用JQuery

.slideDown（）

这就是方法。超级简单，并提供了一个很好的默认动画@Buchow_PHP使用您的版本与更简洁的$（'#button_id'）相比有什么好处吗；

$('.yourClicker').click(function() { 
    $('.yourMenu').slideToggle(); 
    return false;
});