이미지클라우드 hover 디자인 변경됨.

git-svn-id: http://xe-core.googlecode.com/svn/sandbox@4241 201d5d3c-b55e-5fd7-737f-ddc643e51545
This commit is contained in:
k10206 2008-06-06 07:30:50 +00:00
parent 58c1bec1a0
commit 44b9df4fb8
2 changed files with 35 additions and 36 deletions

View file

@ -8,34 +8,33 @@
.imgcloudoutline table { .imgcloudoutline table {
margin: 1px auto; margin: 1px auto;
border:1px solid #ddd; border: 0px solid #ddd;
} }
.imgcloudoutline .imgcloud { .imgcloudoutline img.imgcloud {
border:1px solid #ddd; border: 1px solid #e0e1db;
padding: 2px;
overflow: hidden;
display:block;
}
.imgcloudoutline img.imgcloud:hover {
border: 2px solid #7899AF;
padding: 1px;
overflow: hidden;
display:block;
cursor: pointer;
}
.imgcloudoutline img.imgcloudbig {
border: 1px solid #e0e1db;
padding: 2px;
overflow: hidden;
}
.imgcloudoutline img.imgcloudbig:hover {
border: 2px solid #7899AF;
padding: 1px; padding: 1px;
overflow: hidden; overflow: hidden;
}
.imgcloudoutline .imgcloud:hover {
border: 2px solid #7899AF;
padding: 0px;
overflow: hidden;
}
.imgcloudoutline .imgcloudbig {
border:1px solid #ddd;
padding: 1px;
overflow: hidden;
}
.imgcloudoutline .imgcloudbig:hover {
border: 2px solid #7899AF;
padding: 0px;
overflow: hidden;
}
.imgcloudoutline .cloudimg {
border: 0px;
cursor: pointer; cursor: pointer;
} }

View file

@ -39,55 +39,55 @@
<tbody> <tbody>
<tr valign="middle"> <tr valign="middle">
<td colspan="2" rowspan="2"> <td colspan="2" rowspan="2">
<div class="imgcloudbig" onmouseover="this.className = 'imgcloudbighover';" onmouseout="this.className = 'imgcloudbig';"><a {$url[0 + $colsrows]}><img align="absmiddle" class="cloudimg" src="{$image[0 + $colsrows]}" width="{$width*2+4}" height="{$height*2+4}" /></a></div> <div><a {$url[0 + $colsrows]}><img align="absmiddle" class="imgcloudbig" src="{$image[0 + $colsrows]}" width="{$width*2+4}" height="{$height*2+4}" /></a></div>
</td> </td>
<td> <td>
<div class="imgcloud" onmouseover="this.className = 'imgcloudhover';" onmouseout="this.className = 'imgcloud';"><a {$url[1 + $colsrows]}><img align="absmiddle" class="cloudimg" src="{$image[1 + $colsrows]}" width="{$width}" height="{$height}" /></a></div> <div><a {$url[1 + $colsrows]}><img align="absmiddle" class="imgcloud" src="{$image[1 + $colsrows]}" width="{$width}" height="{$height}" /></a></div>
</td> </td>
<td> <td>
<div class="imgcloud" onmouseover="this.className = 'imgcloudhover';" onmouseout="this.className = 'imgcloud';"><a {$url[2 + $colsrows]}><img align="absmiddle" class="cloudimg" src="{$image[2 + $colsrows]}" width="{$width}" height="{$height}" /></a></div> <div><a {$url[2 + $colsrows]}><img align="absmiddle" class="imgcloud" src="{$image[2 + $colsrows]}" width="{$width}" height="{$height}" /></a></div>
</td> </td>
<td> <td>
<div class="imgcloud" onmouseover="this.className = 'imgcloudhover';" onmouseout="this.className = 'imgcloud';"><a {$url[3 + $colsrows]}><img align="absmiddle" class="cloudimg" src="{$image[3 + $colsrows]}" width="{$width}" height="{$height}" /></a></div> <div><a {$url[3 + $colsrows]}><img align="absmiddle" class="imgcloud" src="{$image[3 + $colsrows]}" width="{$width}" height="{$height}" /></a></div>
</td> </td>
</tr> </tr>
<tr> <tr>
<td> <td>
<div class="imgcloud" onmouseover="this.className = 'imgcloudhover';" onmouseout="this.className = 'imgcloud';"><a {$url[4 + $colsrows]}><img align="absmiddle" class="cloudimg" src="{$image[4 + $colsrows]}" width="{$width}" height="{$height}" /></a></div> <div><a {$url[4 + $colsrows]}><img align="absmiddle" class="imgcloud" src="{$image[4 + $colsrows]}" width="{$width}" height="{$height}" /></a></div>
</td> </td>
<td> <td>
<div class="imgcloud" onmouseover="this.className = 'imgcloudhover';" onmouseout="this.className = 'imgcloud';"><a {$url[5 + $colsrows]}><img align="absmiddle" class="cloudimg" src="{$image[5 + $colsrows]}" width="{$width}" height="{$height}" /></a></div> <div><a {$url[5 + $colsrows]}><img align="absmiddle" class="imgcloud" src="{$image[5 + $colsrows]}" width="{$width}" height="{$height}" /></a></div>
</td> </td>
<td> <td>
<div class="imgcloud" onmouseover="this.className = 'imgcloudhover';" onmouseout="this.className = 'imgcloud';"><a {$url[6 + $colsrows]}><img align="absmiddle" class="cloudimg" src="{$image[6 + $colsrows]}" width="{$width}" height="{$height}" /></a></div> <div><a {$url[6 + $colsrows]}><img align="absmiddle" class="imgcloud" src="{$image[6 + $colsrows]}" width="{$width}" height="{$height}" /></a></div>
</td> </td>
</tr> </tr>
<tr valign="middle"> <tr valign="middle">
<td> <td>
<div class="imgcloud" onmouseover="this.className = 'imgcloudhover';" onmouseout="this.className = 'imgcloud';"><a {$url[7 + $colsrows]}><img align="absmiddle" class="cloudimg" src="{$image[7 + $colsrows]}" width="{$width}" height="{$height}" /></a></div> <div><a {$url[7 + $colsrows]}><img align="absmiddle" class="imgcloud" src="{$image[7 + $colsrows]}" width="{$width}" height="{$height}" /></a></div>
</td> </td>
<td> <td>
<div class="imgcloud" onmouseover="this.className = 'imgcloudhover';" onmouseout="this.className = 'imgcloud';"><a {$url[8 + $colsrows]}><img align="absmiddle" class="cloudimg" src="{$image[8 + $colsrows]}" width="{$width}" height="{$height}" /></a></div> <div><a {$url[8 + $colsrows]}><img align="absmiddle" class="imgcloud" src="{$image[8 + $colsrows]}" width="{$width}" height="{$height}" /></a></div>
</td> </td>
<td> <td>
<div class="imgcloud" onmouseover="this.className = 'imgcloudhover';" onmouseout="this.className = 'imgcloud';"><a {$url[9 + $colsrows]}"><img align="absmiddle" class="cloudimg" src="{$image[9 + $colsrows]}" width="{$width}" height="{$height}" /></a></div> <div><a {$url[9 + $colsrows]}"><img align="absmiddle" class="imgcloud" src="{$image[9 + $colsrows]}" width="{$width}" height="{$height}" /></a></div>
</td> </td>
<td colspan="2" rowspan="2"> <td colspan="2" rowspan="2">
<div class="imgcloudbig" onmouseover="this.className = 'imgcloudbighover';" onmouseout="this.className = 'imgcloudbig';"><a {$url[10 + $colsrows]}><img align="absmiddle" class="cloudimg" src="{$image[10 + $colsrows]}" width="{$width*2+4}" height="{$height*2+4}" /></a></div> <div><a {$url[10 + $colsrows]}><img align="absmiddle" class="imgcloudbig" src="{$image[10 + $colsrows]}" width="{$width*2+4}" height="{$height*2+4}" /></a></div>
</td> </td>
</tr> </tr>
<tr> <tr>
<td> <td>
<div class="imgcloud" onmouseover="this.className = 'imgcloudhover';" onmouseout="this.className = 'imgcloud';"><a {$url[11 + $colsrows]}><img align="absmiddle" class="cloudimg" src="{$image[11 + $colsrows]}" width="{$width}" height="{$height}" /></a></div> <div><a {$url[11 + $colsrows]}><img align="absmiddle" class="imgcloud" src="{$image[11 + $colsrows]}" width="{$width}" height="{$height}" /></a></div>
</td> </td>
<td> <td>
<div class="imgcloud" onmouseover="this.className = 'imgcloudhover';" onmouseout="this.className = 'imgcloud';"><a {$url[12 + $colsrows]}><img align="absmiddle" class="cloudimg" src="{$image[12 + $colsrows]}" width="{$width}" height="{$height}" /></a></div> <div><a {$url[12 + $colsrows]}><img align="absmiddle" class="imgcloud" src="{$image[12 + $colsrows]}" width="{$width}" height="{$height}" /></a></div>
</td> </td>
<td> <td>
<div class="imgcloud" onmouseover="this.className = 'imgcloudhover';" onmouseout="this.className = 'imgcloud';"><a {$url[13 + $colsrows]}><img align="absmiddle" class="cloudimg" src="{$image[13 + $colsrows]}" width="{$width}" height="{$height}" /></a></div> <div><a {$url[13 + $colsrows]}><img align="absmiddle" class="imgcloud" src="{$image[13 + $colsrows]}" width="{$width}" height="{$height}" /></a></div>
</td> </td>
</tr> </tr>