Image rollover in CSS problem

Resolved Rupesh23
(@rupesh23)

12 years, 1 month ago

Hi Tobias,

First of all, Thanks for this wonderful plugin !!!!

I have a problem with Image rollover on a link. I am trying to create a similar table on this website : http://dunlielectric.com/English/products.aspx?p=2 .

I have create a table but the other images with link (PDF) on this table are not visible – http://www.rexnordindia.in/products/ac-axial-fans-plastic-blade/

I have tried the below custom CSS:
.wp-table-reloaded-id-123 td a img{
border-width: 0;
height: 0;
width: 0;
}
.wp-table-reloaded-id-123 a:hover img{
position: fixed;
top: 250px;
left: 250px;
width: 243px;
height: 303px;
z-index: 10;
}

Please help me !!!

https://ww.wp.xz.cn/plugins/wp-table-reloaded/

Viewing 7 replies - 1 through 7 (of 7 total)

Plugin Author Tobias Bäthge
(@tobiasbg)

12 years, 1 month ago

Hi,

thanks for your post, and sorry for the trouble.

Before we investigate this, please switch to TablePress. WP-Table Reloaded is no longer supported.
See http://tobias.baethge.com/2013/01/tablepress-replaces-wp-table-reloaded/ for details.

Regards,
Tobias

Thread Starter Rupesh23
(@rupesh23)

12 years, 1 month ago

Thanks Tobias,

I have switched to TablePress, but my column grid has gone and pls solve my above problem.
Plugin Author Tobias Bäthge
(@tobiasbg)

12 years, 1 month ago
Hi,

good to hear that you updated. The table looks pretty good now, and the PDF icon images work just fine for me. Is this still an issue?

For the grid: That’s the cell border, and I would actually recommend to not use it. See this tweet for a short explanation: https://twitter.com/TablePress/status/452768724647706624

If you really want it, you can add it back with this “Custom CSS”:
```
.tablepress th,
.tablepress td {
  border: 1px solid #dddddd;
}
```
Regards,
Tobias
Thread Starter Rupesh23
(@rupesh23)

12 years, 1 month ago

hello Tobias,

I still have a problem with Image rollover on a link. When I put the code (mentioned in question) PDF becomes invisible. The above code applies to whole table not a single cell.
Plugin Author Tobias Bäthge
(@tobiasbg)

12 years, 1 month ago
Hi,

I suggest that you then make this code apply only in the first column:
```
.tablepress-id-113 .column-1 a img {
  border-width: 0;
  height: 0;
  width: 0;
}
.tablepress-id-113 .column-1 a:hover img {
  position: fixed;
  top: 250px;
  left: 250px;
  width: 243px;
  height: 303px;
  z-index: 10;
}
```
Regards,
Tobias
Thread Starter Rupesh23
(@rupesh23)

12 years ago

It works !!!! Thank you very much !!!!

Plugin Author Tobias Bäthge
(@tobiasbg)

12 years ago

Hi,

no problem, you are very welcome! 🙂 Good to hear that this helped!

Best wishes,
Tobias

P.S.: In case you haven’t, please rate TablePress here in the plugin directory. Thanks!

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘Image rollover in CSS problem’ is closed to new replies.

Tags