Hammad Butt Ответов: 5

как применить эффект наведения курсора мыши на Asp.net сетка-вид?

Я сделал CSS-класс для представления сетки и класс для наведения строки представления сетки, но это происходит не так, как я хочу, нет эффекта наведения мыши.

это настройка вида сетки 
<asp:GridView ID="grd" runat="server" Width="99%" EnableViewState="False" AutoGenerateColumns="False" CssClass="grid-view" DataKeyNames="Nt">// some bound filds here <alternatingrowstyle backcolor="#FFB6C1" /> <rowstyle backcolor="White" forecolor="Black" font-names="Verdana" />

класс CSS
.grid-view tr.normal:hover { background-color: Green; } 
.grid-view tr.alternate:hover { background-color: Green; }

5 Ответов

Рейтинг:
2

Murali0195

Привет...
См. ссылку ниже.
Изюминка asp.net строки gridview при наведении курсора мыши с помощью JavaScript[^]
спасибо.

Рейтинг:
1

Nirav Prabtani

попробовать это...:)


<style type="text/css">
#GridView1 tr.rowHover:hover
{
background-color: Yellow;
font-family: Arial;
}
</style>
<asp:GridView ID="GridView1" runat="server" EnableViewState="false" RowStyle-CssClass="rowHover" ClientIDMode="Static" />

Hammad Butt

в моем случае это не работает. На самом деле моя сетка находится внутри таблицы, а затем панели.
Я думаю, что это создает проблему. как скажешь.
Мне нужно какое-то решение для моего дела.

Nirav Prabtani

попробовать это....:)

http://www.codeproject.com/Articles/25984/Hover-Effects-for-GridView-Rows-Using-CSS

Hammad Butt

Эта ссылка имеет тот же код, что и вы упомянули ранее.

Nirav Prabtani

ладно...мне очень жаль...попробовать это..:)


<%@ Page Language= "C#" % & gt;

<!Элемент DOCTYPE в HTML общественности "-//W3C для//определения DTD XHTML 1.0 переходный//ванной" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&ГТ;

& lt;скрипт runat= "сервер">

protected void GridView1_RowDataBound(отправитель объекта, GridViewRowEventArgs e)

{

если (электронная.Подряд.RowType == DataControlRowType.Строкаданных)

{

е.Подряд.Атрибутами.Добавить ("onMouseOver", " Highlight (this)");

е.Подряд.Атрибутами.Добавить ("onMouseOut", " UnHighlight (this)");

}

}

< / script>

< html xmlns="http://www.w3.org/1999/xhtml" >

&ЛТ;глава атрибут runat="сервер"и GT;

в <название&ГТ;Безымянная страница&ЛТ;/название&ГТ;

< script language= "javascript">

подсветка функции (строка)

{

подряд.стиль.свойство backgroundColor='красный';

}

функция UnHighlight (строка)

{

подряд.стиль.свойство backgroundColor='белый';

}

< / script>

< / head>

& lt;тело>

&ЛТ;форме ID="форма form1" атрибут runat="сервер"и GT;

&ЛТ;АСП:таблицы с ID="gridview1, на" атрибут runat="сервер" AutoGenerateColumns="false" - в DataKeyNames="Кодклиента"

DataSourceID=" SqlDataSource1 "OnRowDataBound=" GridView1_RowDataBound " >

& lt;столбцы>

&ЛТ;как ASP:BoundField datafield в="Кодклиента" HeaderText="Кодклиента" только для чтения="истинный" SortExpression="Кодклиента" /&ГТ;

<asp:BoundField DataField=" CompanyName " HeaderText=" CompanyName "SortExpression=" CompanyName " />

&ЛТ;как ASP:BoundField datafield в="Контактантами" HeaderText="Контактантами" SortExpression="Контактантами" /&ГТ;





&ЛТ;как ASP:sqldatasource его идентификатор="sqldatasource1 на" атрибут runat="сервер" параметр connectionString="&ЛТ;%$ connectionstrings в:NorthwindConnectionString %&ГТ;"

Команды selectcommand="выбрать [Кодклиента], [название организации], [Обращатьсяк] от [клиенты]"&ГТ;



< / форма>

< / body>

< / html>

Nirav Prabtani

http://www.aspdotnet-suresh.com/2011/02/how-to-highlight-gridview-rows-on.html

Рейтинг:
1

_Amy

Пожалуйста, обратитесь к аналогичным статьям ниже:
Эффекты наведения курсора для строк GridView с использованием CSS[^]
Как отобразить эффект наведения курсора мыши в строках GridView, используя только CSS?[^]
Как отобразить эффект наведения курсора мыши на строки GridView с помощью CSS?[^]

-- Амит

Hammad Butt

Я попробовал его на простой сетке на другой странице, на этой странице он работает, но на моей реальной странице он не работает. Я не знаю, что происходит.

_Amy

Это означает, что ваш css не загружен. Проверьте наличие ссылки css на странице.

Hammad Butt

Другие CSS-эффекты происходят, как шрифт и цвет на всей странице.
Css хранится в другом файле.
Эта сетка находится внутри таблицы, панели. Может ли это быть проблемой?

Рейтинг:
0

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ)

Добавить CssClass к RowStyle и AlternatingRowStyle как ниже, так и попробуй.

<AlternatingRowStyle BackColor="#FFB6C1" CssClass="alternate" />

<RowStyle BackColor="White" ForeColor="Black" Font-Names="Verdana" CssClass="normal" />


[Редактировать]

1. Как отобразить эффект наведения курсора мыши в строках GridView, используя только CSS?[^].
2. Код для отображения эффекта наведения курсора мыши в строках GridView с использованием только CSS[^].

[/Редактировать]

Hammad Butt

этого не может быть, брат.

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ)

Затем попробуйте другие техники. Ответ обновлен, пожалуйста, смотрите.

Рейтинг:
0

Shraddha R Kad

Использование JQuery
============

$(document).ready(function() {
        $("#<%=grd.ClientID %> tr:has(td)").hover(function() 
        {
            $(this).css({ "background-color": "Green", "cursor": "pointer" });
        },
        function() 
        {
            $(this).css("background-color", "White");
        }); 
    });

Hammad Butt

это порождает ошибку
Коллекция элементов управления не может быть изменена, поскольку элемент управления содержит блоки кода (т. е. <% ... %и GT;).