【问题标题】:How to get hyperlinks on image on mouse hover?如何在鼠标悬停时获取图像上的超链接?
【发布时间】:2013-10-12 10:11:18
【问题描述】:

我正在制作一个电子商务在线购物网站。 我希望我的页面看起来像 Flipkart 一样。 像这样

主类图片

在鼠标上显示所有子类别的所有超链接

我的桌子是

ProductCategory
Column Name  Data Type  Constraint
CategoryID   Varchar(20)    Primary key
CategoryName Varchar(100)   Unique key
Description  Varchar(1000)  


ProductSubCategory
Column Name     Data Type   Constraint
SubCategoryID   Int    Auto increment , Primary key
SubCategoryName Varchar(100)    
Description     Varchar(1000)   
CategoryID      Varchar(20) Foreign key with Product Category

ProductSubCategory2
Column Name         Data Type   Constraint
SubCategory2ID       Int    Auto increment , Primary key
SubCategory2Name    Varchar(100)    
Description         Varchar(1000)   
SubCategoryID        Varchar(20)    Foreign key with Product SubCategory

CompanyInfo

Column Name Data Type   Constraint
CompanyID   Varchar(20) Primary key
CompanyName Varchar(100)    Unique key
Description Varchar(1000)   

ProductInfo
Column Name Data Type   Constraint
ProductID   Int Primary key , auto increment
ProductName Varchar(100)    
SubCategory2ID  Int Foreign key with ProductSubCategory
CompanyID   Varchar(20) Foreign key with CompanyInfo
Price   Float   
Quantity    Int 
Description Varchar(1000)   

所以请帮助我进行连接查询以显示每个类别的唯一图像,并在鼠标悬停时显示子类别的超链接 请帮助我从数据库中获取图像并为该图像应用 css 或 javaquery

【问题讨论】:

  • 研究他们的 CSS 和 JS 文件。
  • 您要求我们为您做这件事?没办法,先出点力。在开始该项目之前,您可能需要学习很多东西。

标签: javascript asp.net css sql-server-2008 join


【解决方案1】:

对于每个类别 thumb,包括一个包含子类别的所有超链接的 div,给它一个 position: absolute 并设置默认的 display:none

然后在悬停时(您可以使用 css 或 jquery)将 css 属性更改为 display: block

此外,根据您的设计结构,您可能还希望为超链接 div 包含更高的 css z-index 属性

【讨论】:

    【解决方案2】:

    我认为这就是您正在寻找的 http://webdesign.about.com/od/dhtml/a/aadhtmlmenus.htm 使您能够使用 :hover 伪类来显示一个菜单,您可以在其中拥有您的子类别。

    希望对你有帮助

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-03-06
      • 1970-01-01
      • 2013-08-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多