Наложение PNG делает гиперссылку asp неактивной - PullRequest
Новая
       22

Наложение PNG делает гиперссылку asp неактивной

0 голосов
/ 30 октября 2009

Мне удалось получить наложение PNG поверх изображения гиперссылки asp:, но теперь это означает, что гиперссылка не щелкается, есть ли способ обойти это? 

<div class="ProductItem">
      <div class="picture">
          <asp:HyperLink ID="hlImageLink" runat="server" />
          <div class="overlay"></div>
      </div>
</div>

    .HomePageProductGrid .ProductItem
{
    text-align: center;
    margin: 10px 10px 10px 10px;
    width: 310px;
    height: 410px;
    background-repeat:no-repeat;
    position:relative;
}

.HomePageProductGrid .ProductItem .picture
{
    text-align: center;
    position:relative;
    padding-top:43px;
}

.HomePageProductGrid .overlay
{
    background: url(images/frame1.png) no-repeat;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 310px;
    height: 410px;
}

Ответы [ 4 ]

2 голосов
/ 30 октября 2009

Я не совсем уверен, что вы пытаетесь достичь, если вы хотите получить изображение, вы можете щелкнуть, как ссылку, вы можете использовать это:

<asp:HyperLink ID="HyperLink1" runat="server" ImageUrl="~/Images/MyPic.png" NavigateUrl="~/MyPage.aspx">HyperLink</asp:HyperLink>

0 голосов
/ 02 ноября 2009

Оберните все, включая наложение в asp: гиперссылка 

<div class="ProductItem">

    <asp:HyperLink ID="testHyperlink" CssClass="pictureLink" runat="server" >
        <div class="picture">
            <asp:Image ID="imgProduct" runat="server" />
            <asp:Panel ID="productPanel" runat="server" ></asp:Panel>
        </div>
    </asp:HyperLink>

</div>

Вам придется немного изменить свой CSS, но это должно решить вашу проблему с наложением.

0 голосов
/ 30 октября 2009

Спасибо за ответ. Гиперссылка получает изображение из базы данных, и я хотел наложить рамку рисунка поверх. Я позиционировал изображение PNG, используя CSS и абсолютное позиционирование, но как только изображение PNG оказалось сверху, я потерял связь. Теперь я изменил код так: 

<div class="ProductItem">

            <div class="picture">
                <asp:Image ID="imgProduct" runat="server" />

                <asp:HyperLink ID="testHyperlink" CssClass="pictureLink" runat="server" >
                <asp:Panel ID="productPanel" runat="server" ></asp:Panel>

                </asp:HyperLink>

            </div>
        </div>

Элемент управления изображением теперь извлекает изображение из базы данных, и я обернул элемент управления гиперссылкой вокруг элемента управления панели. Панель управления получает случайное изображение кадра изображения из выбора 4 кадров. URL для изображения базы данных передается в элемент управления гиперссылкой.

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

0 голосов
/ 30 октября 2009

Я не знаю, как работает "asp: hyperLink", но вы пытались дать ему z-index больше, чем оверлей? Ссылка может нуждаться в позиции: относительно, чтобы она работала.

...