0

我很难使用 JQuery 向我的网站添加动态功能。

<table id="structure">
    <tr>
        <td id="navigation">
            <?php echo public_navigation($sel_subject, $sel_page); ?>
        </td>
        <td id="page">
            <?php if ($sel_page) { ?>
                <h2><?php echo htmlentities($sel_page['menu_name']); ?>   </h2>
                <div class="page-content">
                    <?php echo strip_tags(nl2br($sel_page['content']), "<b><br><p><a>"); ?>
                </div>
            <?php } else { ?>
                <h2>Welcome to my "to the point" news and blog mix.</h2>
            <?php } ?>
           <br />
           <?php
           // garbledeegoo starts here
           ?>
           <p>JScript Practice</p>
           <div id="jscriptprac">text</div>
           <br /> 
           <h2>To Do</h2>
        <form name="checkListForm">
            <input type="text" name="checkListItem"/>
        </form>
        <div id="button">Add!</div>
        <br/>
        <div class="list"></div>
           <?php
           // garbledeegoo ends here
           ?>
        </td>
    </tr>
</table>

问题是我不能让 jquery 标记选择器样式我的导航我有检索我的内容的 SQL 语句。

$(document).ready(function(){
$("*").hover(function(){
    $(this).stop(true, true).animate({ width:"+=25px", padding:"+=25px" });
}, function() {
    $(this).stop(true, true).animate({ width:"-=25px", width:"-=25px" });
});
});

这只是选择一切，但它仍然没有选择导航。

<td id="navigation">
    <?php echo public_navigation($sel_subject, $sel_page); ?>
</td>

我想将 .animate jquery 添加到主题和页面中，这些主题和页面像列表一样显示为侧导航栏。有没有办法设置查询结果的样式？

我为我缺乏准确的词汇而道歉。如果您无法想象我的意思，codeybuzz.com 是该网站，我不想在 .hover 事件上更改导航链接的颜色，而是想在鼠标悬停时使用 jquery 为它们设置动画。我认为用表格做这件事可能与它不可选择有关，但我不知道如何将它们全部更改为 div 并且不破坏我已经拥有的 css 样式。

这是呈现的 HTML

<td id="navigation"> 
 <ul class="subjects">
  <li><a href="index.php?subj=1">About Codey Buzz</a></li>
  <li><a href="index.php?subj=2">No Rubbish, Blog</a></li>
  <li><a href="index.php?subj=3">Top News</a></li>
 </ul>   
</td>

我用这个实现了某种效果，但它不是很有效。

$(document).ready(function(){
$("ul.subjects > li").hover(function(){
    $(this).mouseenter(function() {
        $(this).animate({ width: "+=50px" }).stop(true, true);
    });
    $(this).mouseleave(function() {
        $(this).animate({ width: "-=50px" }).stop(true, true);
});
});
});
4

0 回答 0