html中给td加入点击效果,HTML TD可点击

我中有你可以在右上角看到一个菜单 - www.balibar.coHTML TD可点击

HTML：

Search

Languages

Login

CSS：

table#indexNavigation {

width: 100%;

height: 25px;

font-weight: normal;

font-size: 1.1em;

border-collapse: collapse;

}

table#indexNavigation td {

text-align: center;

color: white;

width: 33.33%;

border-right: 1px solid #FFF;

cursor: pointer;

}

table#indexNavigation td#activeNavLink {

border-right: none;

}

我想使整个TD可点击。 我已经添加了光标：指针;到达TD的时候，除了话语之外，它不会亮起来。 我试图把外面的，但这不起作用。

有没有一个技巧让这个可点击。然后 将钩这件事将jQuery的单击事件 - 例如：

$('td#activeNavLink').click(function() {

THX

2011-09-26

Adam

+0

你不能让'' –

+1

这确实应该是一个列表，而不是一个表。 –

+0

雅我正在使用一个列表，但表格只是坐在... –

A

回答

0

你应该在你的CSS使用display:block。

下面是一个无序列表(UL)与块链接的例子：link

2011-09-26 12:40:30

johankj

+0

这并没有真正回答这个问题。 –

+0

我同意:) :) :) –

2

只是让你的链接里面你td标签有100％的宽度。然后他们将占据整个单元格的宽度。

table#indexNavigation td a {

display: block;

width: 100%;

text-align: center;

}

2011-09-26 12:43:33

+0

抱歉不起作用...抛出格式化 –

+0

你在说什么格式？ –

+0

等一下，我想我明白了 - 我忘了我的css定义中的'a'。 –

-1

你有两个选择

通过CSS只

在这里你实际上使锚标记一个块元素，给它充分的宽度和高度，使其一样大表细胞... table td a {

display: block;

width: 100%;

height: 100%;

}

句话您可能需要ŧ o移动到一些填充和这样从TD元件到A元件

由JavaScript

这意味着，加入点击事件到td元素，然后触发来自这是该表内的锚固元件的点击细胞。 $('#mytable td').each(function(){

$(this).css({'cursor': 'pointer'}).click(function(){

$(this).find('a:first').trigger('click');

});

});

2011-09-26 12:57:12

Sander

+0

绝对没有理由使用JavaScript来做到这一点，并推荐不必要的JavaScript几乎从来没有好建议。 –

+1

呃OP自己要求通过JavaScript来做到这一点，为了公平我给了这两个选项！从来没有说过使用额外的JavaScript比只使用CSS更好。并坦率地说，JavaScript是唯一支持css的东西，它可以在任何地方工作，它的css取决于布局以及你需要使用哪些浏览器。 –

+0

给我一个例子，其中css解决方案不起作用。 –