- android - RelativeLayout 背景可绘制重叠内容
- android - 如何链接 cpufeatures lib 以获取 native android 库?
- java - OnItemClickListener 不起作用,但 OnLongItemClickListener 在自定义 ListView 中起作用
- java - Android 文件转字符串
我有一个使用无序列表的简单画廊。
<h1>Projects</h1>
<hr>
<!-- Projects gallery as unordered list -->
<ul class="gallery">
<li class="item residential">
<img src="Projects/01-HighTorEast-EarlShilton/01-thumbnail.jpg" width="212" height="119" alt="High Tor East, Earl Shilton">
<h2><a class="info" href="Projects/01-HighTorEast-EarlShilton/info.php">High Tor East, Earl Shilton</a></h2>
<h3><a class="cat" href="residential">Residential</a></h3>
</li>
<li class="item modernisation">
<img src="Projects/02-Hollycroft-Hinckley/02-thumbnail.jpg" width="212" height="119" alt="Hollycroft, Hinckley">
<h2><a class="info" href="Projects/02-Hollycroft-Hinckley/info.php">Hollycroft, Hinckley</a></h2>
<h3><a class="cat" href="modernisation">Modernisation & Domestic Extensions</a></h3>
</li>
<li class="item residential">
<img src="Projects/03-SpaLane-Hinckley/03-thumbnail.jpg" width="212" height="119" alt="Spa Lane, Hinckley">
<h2><a class="info" href="Projects/03-SpaLane-Hinckley/info.php">Spa Lane, Hinckley</a></h2>
<h3><a class="cat" href="residential">Residential</a></h3>
</li>
<li class="item residential">
<img src="Projects/04-Farnhambridge-Rothley/04-thumbnail.jpg" width="212" height="119" alt="Farnhambridge Farm, Rothley">
<h2><a class="info" href="Projects/04-Farnhambridge-Rothley/info.php">Farnhambridge Farm, Rothley</a></h2>
<h3><a class="cat" href="residential">Residential</a></h3>
</li>
<li class="item modernisation">
<img src="Projects/05-NetherfieldClose-BroughtanAstley/05-thumbnail.jpg" width="212" height="119" alt="Netherfield Close, Broughtan Astley">
<h2><a class="info" href="Projects/05-NetherfieldClose-BroughtanAstley/info.php">Netherfield Close, Broughtan Astley</a></h2>
<h3><a class="cat" href="modernisation">Modernisation & Domestic Extensions</a></h3>
</li>
<li class="item modernisation">
<img src="Projects/06-Bridlepath-Elmesthorpe/06-thumbnail.jpg" width="212" height="119" alt="Bridlepath, Elmesthorpe">
<h2><a class="info" href="Projects/06-Bridlepath-Elmesthorpe/info.php">Bridlepath, Elmesthorpe</a></h2>
<h3><a class="cat" href="modernisation">Modernisation & Domestic Extensions</a></h3>
</li>
<li class="item residential">
<img src="Projects/07-Bridlepath-Elmesthorpe/07-thumbnail.jpg" width="212" height="119" alt="Bridlepath, Elmesthorpe">
<h2><a class="info" href="Projects/07-Bridlepath-Elmesthorpe/info.php">Bridlepath, Elmesthorpe</a></h2>
<h3><a class="cat" href="residential">Residential</a></h3>
</li>
<li class="item feasibility">
<img src="Projects/08-GrangeCroft-Ullesthorpe/08-thumbnail.jpg" width="212" height="119" alt="Grange Croft, Ullesthorpe">
<h2><a class="info" href="Projects/08-GrangeCroft-Ullesthorpe/info.php">Grange Croft, Ullesthorpe</a></h2>
<h3><a class="cat" href="feasibility">Feasibility layouts</a></h3>
</li>
<li class="item master">
<img src="Projects/09-RailwayInn-Sileby/09-thumbnail.jpg" width="212" height="119" alt="The Railway Inn, Sileby">
<h2><a class="info" href="Projects/09-RailwayInn-Sileby/info.php">The Railway Inn, Sileby</a></h2>
<h3><a class="cat" href="master">Master planning</a></h3>
</li>
</ul>
</section>
在我的 css 中,我将 .item 类的每四个 child 的右边距值设置为零。我这样做是为了在我的页面上将四个元素排成一行,并且在不删除边距的情况下我只能容纳三个。
ul.gallery { clear:both; list-style:none; margin:0; padding:0; width:940px; }
.gallery a:hover { text-decoration:underline; }
li.item { display:inline; margin:30px 20px 30px 0px; padding:0px; height:178px; width:220px; float:left; background:#ededed url('../Images/featuredline.png') repeat-x 0% 100%; overflow:hidden; }
li.item:nth-child(4n+4) { margin:30px 0px 30px 0px; }
接下来,我编写了一些小的 jQuery 代码来按类别对元素进行排序。因此,如果有人点击“住宅”链接,它将隐藏不同类别的元素。
$('.cat').bind('click', function(e) {
var cat = $(this).attr('href');
$('.item').each(function () {
var itemClass = $(this).attr('class');
if (itemClass != 'item '+cat) {
$(this).css({"display":"none"});
};
});
e.preventDefault();
我的问题是:当我使用上面的 jQuery 脚本对我的画廊元素进行排序时,似乎 .item:nth-child 属性仍在计算显示属性设置为无的元素。我不知道怎么咬它。我需要 css .item:nth-child 属性在 jQuery 插件启动后只计算可见元素。
最佳答案
删除你的第 nth-child CSS 样式,每次你改变布局时,调用这个:
$("li.item:visible").each(function(i) {
if((i+1)%4==0) $(this).css("margin","30px 0");
else $(this).css("margin","30px 20px 30px 0");
})
刚刚在您的站点上使用 firebug 对其进行了测试,效果很好。
关于javascript - 第 N 个子 css 属性正在计算 display 属性设置为 none 的 html 元素。怎么改?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14664050/
我有一个加号/减号按钮,希望用户不能选择超过 20 个但不知道如何让它工作。我尝试使用 min="1"max="5 属性,但它们不起作用。这是我的代码和一个 fiddle 链接。https://jsf
我正在尝试复制顶部底部图,如示例 here但它没有正确渲染(紫色系列有 +ve 和 -ve 值,绿色为负值)留下杂乱的人工制品。我也在努力创建一个玩具示例来复制这个问题,所以我希望尽管我缺乏数据,但有
已关闭。此问题不符合Stack Overflow guidelines 。目前不接受答案。 这个问题似乎与 help center 中定义的范围内的编程无关。 . 已关闭 6 年前。 社区去年审查了是
这个问题在这里已经有了答案: Adding two positive integers gives negative answer.Why? (4 个答案) 关闭 5 年前。 我遇到了一个奇怪的问题
有谁知道如何将字符串值类型 -4,5 或 5,4 转换为 double -4.5 或 5.4? 最佳答案 只需使用 Double.parseDouble(Locale, String); 糟糕,我很困
我正在尝试根据 TextBlob 分类插入一个仅包含“正”或“负”字符串的新数据框列:对于我的 df 的第一行,结果是 ( pos , 0.75, 0.2499999999999997)我想要' 正
我对 VBA 非常陌生,无法理解如何在一个循环中完成 2 个任务。我非常感谢您的帮助。 我已经能够根据第 3 列中的数据更改第 2 列中的数值,但我不明白如何将负值的字体更改为红色。 表格的大小每月都
欢迎, 我正在使用 jquery 通过 POST 发送表单。 这就是我获得值(value)的方式。 var mytext = $("#textareaid").val(); var dataStrin
double d = 0; // random decimal value with it's integral part within the range of Int32 and always p
我有这个字符串: var a='abc123#xyz123'; 我想构建 2 个正则表达式替换函数: 1) 用 '*' 替换所有确实有 future '#'的字符(不包括'#') 所以结果应该是这样的
我正在使用 DialogFragment。当用户从 Gmail 平板电脑应用程序的屏幕与下面示例图片中的编辑文本进行交互时,我希望正面和负面按钮保持在键盘上方。 在我的尝试中不起作用,这是我的 Dia
从组装艺术一书中,我复制了这句话: In the two’s complement system, the H.O. bit of a number is a sign bit. If the H.O
是否有更好更优雅的方法来实现下面的简单代码(diffYear、A 和 B 是数字): diffYear = yearA - yearB; if (diffYear == 0) { A = B
我正在设计一种语言,并尝试确定 true 应该是 0x01 还是 0xFF。显然,所有非零值都将转换为 true,但我正在尝试确定确切的内部表示。 每种选择的优点和缺点是什么? 最佳答案 没关系,只要
在我的 dialogfragment 类的 OnCreateDialog 中,我正在这样做: AlertDialog.Builder builder = new AlertDialog.Builder
这个问题在这里已经有了答案: Resolving ambiguous overload on function pointer and std::function for a lambda usin
我偶然发现了一个奇怪的 NSDecimalNumber 行为:对于某些值,调用 integerValue、longValue、longLongValue 等,返回意想不到的值(value)。示例: l
这个问题在这里已经有了答案: Resolving ambiguous overload on function pointer and std::function for a lambda using
我有这个正则表达式来测试用户输入是否有效: value.length === 0 || value === '-' || (!isNaN(parseFloat(value)) && /^-?\d+\.
我想用高斯混合模型拟合数据集,数据集包含大约 120k 个样本,每个样本有大约 130 个维度。当我使用 matlab 执行此操作时,我运行脚本(簇号为 1000): gm = fitgmdist(d
我是一名优秀的程序员,十分优秀!