C # .NET Website - добавление CSS-класса в элементы меню - PullRequest
Новая
       14

C # .NET Website - добавление CSS-класса в элементы меню

4 голосов
/ 08 июня 2011

Я использую PHP уже 7 лет или около того, но с сегодняшнего дня меня привлекают к использованию .NET для проекта. Просто для инсайта:

Особенности этого проекта:

.NET4 Viewstate = false

Теперь моя проблема заключается в следующем. Основной макет покрыт главной страницей, которая кажется довольно очевидной, как она работает Он также включает опции меню навигации, такие как: 

<div id="menu">
    <ul>
        <li><a href="default.aspx" title="Home" >Home</a></li>
        <li><a href="products.aspx" title="Products">Products</a></li>
        <li><a href="prices.aspx" title="Size &amp; Price">Size &amp; Price</a></li>
        <li><a href="formats.aspx" title="File Formats">File Formats</a></li>
    </ul>
</div>

Теперь я хотел бы добавить атрибут класса CSS в зависимости от того, на какой странице я работаю, поэтому, если бы я был на странице продуктов, я получил бы следующий источник: 

<div id="menu">
    <ul>
        <li><a href="default.aspx" title="Home" >Home</a></li>
        <li><a href="products.aspx" class="active" title="Products">Products</a></li>
        <li><a href="prices.aspx" title="Size &amp; Price">Size &amp; Price</a></li>
        <li><a href="formats.aspx" title="File Formats">File Formats</a></li>
    </ul>
</div>

Любая помощь будет принята с благодарностью!

Приветствия:)

Ответы [ 3 ]

4 голосов
/ 08 июня 2011

Множество способов сделать это, один из них - добавить скрипт на «ведомую» страницу, которая устанавливает класс соответствующего тега. 

<li><a href="default.aspx" title="Home" id="aHome" >Home</a></li>
<li><a href="products.aspx" title="Products" id="aProducts">Products</a></li>

Затем в products.aspx вы можете сделать:

<SCRIPT>document.getElementById('aProducts').setAttribute('class', 'active');</SCRIPT>
1 голос
/ 08 июня 2011

Это не ответ на ваш вопрос, но это было в категории CSS, поэтому я решил, что по крайней мере прокомментирую:)

Я бы настоятельно рекомендовал установить статические классы для каждого элемента списка, ив сочетании с классами тела в CSS, используйте что-то вроде: 

<style type="text/css"><!--
    body.products #menu li.products a,
    body.otherpage1 #menu li.otherpage1 a,
    body.otherpage2 #menu li.otherpage2 a,
    body.otherpage3 #menu li.otherpage3 a,
    body.otherpage4 #menu li.otherpage4 a, { /* your styles here*/ }
--></style>

Я думаю, что использование C # для просто установки класса немного излишне, вот и все:)

0 голосов
/ 08 июня 2011

Я бы начал с преобразования ссылок на элементы управления сервером. См. страницу MSDN для . После этого я сделаю интерфейс для моей MasterPage, так что, если мне когда-нибудь понадобится изменить MasterPages, я смогу реализовать тот же интерфейс и не буду беспокоиться о нарушении моей сборки (мы публично представим некоторые свойства в следующий шаг, так что это будет полезно). 


public interface IMasterPage
{
    String LnkHomeClass { get; set; }
    String LnkProductsClass { get; set; }
    ...
}

Теперь, как я уже говорил, предоставьте атрибут CssClass для ваших гиперссылок в коде вашей MasterPage. 


public string LnkProductsClass
{
    get 
    {
        return LnkProducts.CssClass;    
    }
    set
    {
        LnkProducts.CssClass = value;
    }
}

Теперь вы можете установить их на своих дочерних страницах. 


IMasterPage masterPage = Master as IMasterPage;
if (masterPage != null)
{
    masterPage.LnkProductsClass = “active”;
}

Другой вариант, с которым я менее знаком, может заключаться в использовании вложенных MasterPages .

...