Results 1 to 1 of 1
Related
-
Iframe won't display in safari :( Forum: HTML Forum
Replies: 1 -
site review: http://www.fix-it.org - users supporting other users! Forum: Show it off!
Replies: 0 -
Safari Shutdown Forum: Javascript Forum
Replies: 1 -
Alignment in Safari Forum: CSS Forum
Replies: 3 -
Layout problem on Safari (Mac) Forum: CSS Forum
Replies: 3
-
12-03-2010, 08:07 PM #1
Hello! But help (safari/webkit users only)
OK I was making a game display like the google images thing. (read something about css animation if you haven't) and I want my text to appear without the table resizing. I KNOW IM SUPPOSED TO USE DIVS but I started good with tables so I kept them. HERE IS MY PHP/HTML/CSS CODE: note: post[title] = title
HTML Code:<?php $_POST['title'] = 'Games'; include("includes/header.php");?> <style type="text/css"> table.games { table-layout: fixed; } td img.mouseOver { -webkit-transform:scale(1); -webkit-transform-origin:center; -webkit-transition-property: -webkit-transform, height; -webkit-transition-duration: 0.5s; -webkit-transition-timing-function: ease-in-out; overflow: hidden; height:64; position:relative; z-index:1; } td img.mouseOver:hover { -webkit-transform:scale(2,2); height:64px; z-index:2; } td.st { vertical-align: top; height:64px; } div.secret { -webkit-transform: scale(0); //overflow: hidden; } table.games tr td:hover div.secret { -webkit-transform: scale(1); } </style> <table class="games"> <tr style="height:64px;"> <td class="st" style="width:72px;height:72px;padding-left:8px;padding-top:8px;"> <img src="images/ssd.png" class="mouseOver" width=64px height=64px /> <div class="secret">Secret Text!</div> </td> <td class="st" style="width:72px;height:72px;padding-left:8px;padding-top:8px;"> <img src="images/ssd.png" class="mouseOver" width=64px height=64px /> </td> </tr> <tr style="height:64px;"> <td class="st" style="width:72px;height:72px;padding-left:8px;padding-top:8px;"> <img src="images/ssd.png" class="mouseOver" width=64px height=64px /> </td> <td class="st" style="width:72px;height:72px;padding-left:8px;padding-top:8px;"> <img src="images/ssd.png" class="mouseOver" width=64px height=64px /> </td> </tr> </table> <?php include("includes/footer.php"); ?>
Cloudjiffy- PaaS for Developers
10-05-2020, 12:30 AM in Web Hosting Forum