大佬教程收集整理的这篇文章主要介绍了javascript – 当第二列的第一行中存在图像时,jQuery动态更改表中第一列的填充顶部,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我想在第二列的第一行中存在图像时动态地向第一列添加填充顶部.如果调整窗口大小并且图像不再位于第一行(或者新图像被推入第一行),则第1列中文本的填充顶部应自动更新以确保基线文本在两列中排成一行.
<html> <head> <script type="text/javascript" src="scripts/jquery.js"></script> <script type="text/javascript" src="scripts/script.js"></script> <link rel="stylesheet" type="text/css" href="styles/style.css" /> </head> <body> <table> <tr> <td style="vertical-align:top"><p class="tabhead">Note:</p></td> <td style="vertical-align:top"><p class="tabtext">This is text and - z0mg no,not an image!<img src="http://files.softicons.com/download/web-icons/minicons-numbers-icons-by-icojam/png/16x16/blue/025.png" /> what will we do?<br />Save us!</p></td> </tr> </table> </body> </html>
样式表
.tabhead { display: block; vertical-align: top; font-family: "Tahoma",verdana,arial,Helvetica,sans-serif; font-style: normal; font-variant: normal; font-weight: bold; font-size: 9pt; } .tabtext { font-family: "Tahoma",sans-serif; font-style: normal; font-variant: normal; font-weight: normal; font-size: 9pt; vertical-align: baseline; }
$(document).ready(function() { window.seTinterval("update_tbl_padding()",100); } function update_tbl_padding() { //if column 1 has either a direct or indirect img element as a descendant //if you wanted it to be a direct child element the SELEctor would be //$("#column_1 > img") if($("#column_1 img").size() >= 1) { //just an example var pad_top_val = "5px"; $("#column_1").css("padding-top",pad_top_val); } //since you're checking to see if a new image is pushed in,I'm guessing you //would want to check to see if its taken out too...hence this else clause else { var pad_top_default_val = "0px"; $("#column_1").css("padding-top",pad_top_default_val); } }
以上是大佬教程为你收集整理的javascript – 当第二列的第一行中存在图像时,jQuery动态更改表中第一列的填充顶部全部内容,希望文章能够帮你解决javascript – 当第二列的第一行中存在图像时,jQuery动态更改表中第一列的填充顶部所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。