jquery - ライトボックス ギャラリーを垂直から水平に変更する

Question

私のタイトル状態のライトボックスには、このような開いているギャラリーの例があります。水平から垂直に変更する方法について、ヒントやアイデアを教えてください。

この質問をしようとしていて、投稿する前に答えを見つけたので、解決策を共有したいと思います。

前提条件:

最新の JQuery.js

1.<script src="light-box/jquery.lightbox-0.5.js" type="text/javascript"></script>
2.<link href="light-box/jquery.lightbox-0.5.css" rel="stylesheet" type="text/css" />

3.<script type="text/javascript">
            $(function () {
                $('#gallery a').lightBox();
            });
    </script>`
4.      <style type="text/css">
/* jQuery lightBox plugin - Gallery style */
#gallery {
    background-color: #444;
    padding: 10px;
    width: 135px;
}
#gallery ul { list-style: none; }
#gallery ul li { display: inline; }
#gallery ul img {
    border: 5px solid #3e3e3e;
    border-width: 5px 5px 20px;
}
#gallery ul a:hover img {
    border: 5px solid #fff;
    border-width: 5px 5px 20px;
    color: #fff;
}
#gallery ul a:hover { color: #fff; }
</style>

「#gallery ul li { display: inline; }」がインラインであることに注意してください。「list-item」に変更するだけで、垂直位置になります。

LightBox のダウンロードはこちら.

Answer 1

#gallery ul li { display: list-item; }