On Hover Show on hover effect (Added in v 4.0)

On hover effect is particularly useful when you have large number of columns in grid/table. Due to large number of columns, it shows the scroll if the data doesn't fit. You need to horizontal scroll to reach to action buttons. Using hover css, you won't need to scroll because on hover, it will show the action button directly. We have created a skin named "hover", you will either need to use this skin or you can directly use the css shown below to achieve this effect

  
                                $pdocrud = new PDOCrud();
                                $pdocrud->setSkin("hover");//add this skin to show hover effect
                                echo $pdocrud->dbTable("products")->render();

                                //Or you can add below css in your style file 
                                    .pdocrud-table-container table tr.pdocrud-header-row th{
                                        padding: 9px 15px;    
                                    }
                                    .pdocrud-table tbody tr.pdocrud-data-row{
                                        height: 50px;
                                    }
                                    .pdocrud-table tbody tr.pdocrud-data-row:hover td.pdocrud-row-actions{
                                        position: absolute;
                                        right: 0;
                                        border-left: none;
                                        margin-top: 0;
                                        border-top: 1px solid #000;
                                    }
                                    .pdocrud-table tbody tr.pdocrud-data-row:hover td{
                                        background: #000;
                                        color: #fff;
                                    }
                            

On hover effect using PDOCrud

Products

Showing 1 to 10 of 108 entries

# Product id Product name Product line ProductScale ProductVendor Product description Product image Product url Qty available Product price Product sell price Tax Product discount Added date Product cat Actions
1 S10_4698 2003 Harley-Davidson Eagle Drag Bike Motorcycles 1:10 Red Start Diecast Model features, official Harley Davidson logos and insignias, detachable rear wheelie bar, heavy diecast metal with resin parts, authentic multi-color tampo-printed graphics, separate engine drive belts, free-turning front fork, rotating tires and rear racing slick, certificate of authenticity, detailed engine, display stand , precision diecast replica, baked enamel finish, 1:10 scale model, removable fender, seat and tank cover piece for displaying the superior detail of the v-twin engine http://findicons.com/files/icons/2738/pretty_office_icon_set_part_9/128/product_documentation.png http://demo.digitaldreamstech.com/SimplifiedDB/documentation/PDO/pdo-transactions.php 5582 91.02 193.66 0 0 2016-12-20 Electronics
2 S10_4757 1972 Alfa Romeo GTA Classic Cars 1:10 Motor City Art Classics Features include: Turnable front wheels; steering function; detailed interior; detailed engine; opening hood; opening trunk; opening doors; and detailed chassis. http://findicons.com/files/icons/2834/flatastic_part_2/128/product.png https://codecanyon.net/user/ddeveloper/portfolio?ref=ddeveloper 3252 85.68 136.00 0 0 2016-12-20 Fashion
3 S10_4962 1962 LanciaA Delta 16V Classic Cars 1:10 Second Gear Diecast Features include: Turnable front wheels; steering function; detailed interior; detailed engine; opening hood; opening trunk; opening doors; and detailed chassis. http://displays2go.com.au/slir/w144-h144/images/product_images/1369184182.jpg https://codecanyon.net/user/ddeveloper/portfolio?ref=ddeveloper 6791 103.42 147.74 0 0 2016-12-20 Electronics
4 S12_1099 1968 Ford Mustang Classic Cars 1:12 Autoart Studio Design Hood, doors and trunk all open to reveal highly detailed interior features. Steering wheel actually turns the front wheels. Color dark green. http://displays2go.com.au/slir/w144-h144/images/product_images/1384248587.jpg https://codecanyon.net/item/wordpress-awesome-import-export-plugin/12896266 68 95.34 194.57 0 0 2016-12-20 Electronics
5 S12_1108 2001 Ferrari Enzo Classic Cars 1:12 Second Gear Diecast Turnable front wheels; steering function; detailed interior; detailed engine; opening hood; opening trunk; opening doors; and detailed chassis. http://displays2go.com.au/slir/w144-h144/images/product_images/1392593620.jpeg https://codecanyon.net/user/ddeveloper/portfolio?ref=ddeveloper 3619 95.59 207.80 0 0 2016-12-20 Fashion
6 S12_1666 1958 Setra Bus Trucks and Buses 1:12 Welly Diecast Productions <p><font color="red">Model features 30 windows, skylights &amp; glare <strong>resistant</strong> glass, working steering system, original logos</font></p> http://displays2go.com.au/slir/w144-h144/images/product_images/1369181990.jpg https://codecanyon.net/user/ddeveloper/portfolio?ref=ddeveloper 1579 77.90 136.67 0 0 2016-12-20 Electronics
7 S12_2823 2002 Suzuki XREO Motorcycles 1:12 Unimax Art Galleries Official logos and insignias, saddle bags located on side of motorcycle, detailed engine, working steering, working suspension, two leather seats, luggage rack, dual exhaust pipes, small saddle bag located on handle bars, two-tone paint with chrome accents, superior die-cast detail , rotating wheels , working kick stand, diecast metal with plastic parts and baked enamel finish. http://displays2go.com.au/slir/w144-h144/images/product_images/1392609013.jpg https://codecanyon.net/user/ddeveloper/portfolio?ref=ddeveloper 9997 66.27 150.62 0 0 2016-12-20 Electronics
8 S12_3148 1969 Corvair Monza Classic Cars 1:18 Welly Diecast Productions 1:18 scale die-cast about 10" long doors open, hood opens, trunk opens and wheels roll http://displays2go.com.au/images/product_images/1392665476.gif https://codecanyon.net/user/ddeveloper/portfolio?ref=ddeveloper 6906 89.14 151.08 0 0 2016-12-20 Electronics
9 S12_3380 1968 Dodge Charger Classic Cars 1:12 Welly Diecast Productions 1:12 scale model of a 1968 Dodge Charger. Hood, doors and trunk all open to reveal highly detailed interior features. Steering wheel actually turns the front wheels. Color black http://displays2go.com.au/slir/w144-h144/images/product_images/1384248587.jpg http://demo.digitaldreamstech.com/wp-awesome-import-export-documentation 9123 75.16 117.44 0 0 2016-12-20 Electronics
10 S12_3891 1969 Ford Falcon Classic Cars 1:12 Second Gear Diecast Turnable front wheels; steering function; detailed interior; detailed engine; opening hood; opening trunk; opening doors; and detailed chassis. http://displays2go.com.au/slir/w144-h144/images/product_images/1384248587.jpg https://codecanyon.net/user/ddeveloper/portfolio?ref=ddeveloper 1049 83.05 173.02 0 0 2016-12-20 Electronics
# Product id Product name Product line ProductScale ProductVendor Product description Product image Product url Qty available Product price Product sell price Tax Product discount Added date Product cat Actions