簡體   English   中英

如何在jQuery / Javascript中刪除此突出顯示腳本

[英]How do i remove this highlight script in jQuery/Javascript

我在網上找到了此流腳本。 單擊div時,它使用jQuery和PHP加載更多評論。 但這不是我需要知道的。 它預裝了此功能,當您的鼠標懸停在注釋正文(post_container)上時,它將突出顯示。 我看不懂JS / jQuery。所以有人可以告訴我我在哪里可以刪除它嗎? 這真的有幫助:)

繼承人來源:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"  dir="ltr">
<head>
<title>stream</title>
    <style type="text/css">
        #posts-container            { width:400px; border:1px solid #ccc;  color: #62D7D7;  }
        .post                       { padding:5px 10px 5px 100px; min-height:65px; border-bottom:1px solid #ccc; background:url(dwloadmore.) 5px 5px no-repeat; cursor:pointer;  }
        .post:hover                 { background-color:lightblue; }
        a.post-title                { font-weight:bold; font-size:12px; text-decoration:none; }
        a.post-title:hover          { text-decoration:underline; color:#900; }
        a.post-more                 { color:#900; }
        p.item-content              { font-size:10px; line-height:17px; paddin color: #62D7D7;g-bottom:0; }
        #load-more                  {
    background-color:#eee;
    color:#999;
    font-weight:bold;
    text-align:center;
    padding:10px 0;
    cursor:pointer;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}
        #load-more:hover            { color:#666; }
        .activate                   { background:url(loadmorespinner.gif) 140px 9px no-repeat #eee; }
    </style>
    <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="jquery.scrollTo-1.4.2.js"></script>
    <script type="text/javascript">
        //when the DOM is ready
        $(document).ready(function(){
            //settings on top
            var domain = 'http://davidwalsh.name/';
            var initialPosts = <?php echo get_posts(0,$_SESSION['posts_start']); ?>;
            //function that creates posts
            var postHandler = function(postsJSON) {
                $.each(postsJSON,function(i,post) {
                    //post url
                    var postURL = '' + domain + post.name;
                    var id = 'post-' + post.ID;
                    //create the HTML
                    $('<div></div>')
                    .addClass('post')
                    .attr('id',id)
                    //generate the HTML
                    .html('<a href="' + postURL + '" class="post-title">' + post.username + '</a><p class="item-content">' + post.item_content + '<br /><a href="' + postURL + '" class="post-more">Read more...</a></p>')
                    .click(function() {
                        window.location = postURL;
                    })
                    //inject into the container
                    .appendTo($('#posts'))
                    .hide()
                    .slideDown(250,function() {
                        if(i == 0) {
                            $.scrollTo($('div#' + id));
                        }
                    });
                }); 
            };
            //place the initial posts in the page
            postHandler(initialPosts);
            //first, take care of the "load more"
            //when someone clicks on the "load more" DIV
            var start = <?php echo $_SESSION['posts_start']; ?>;
            var desiredPosts = <?php echo $number_of_posts; ?>;
            var loadMore = $('#load-more');
            //load event / ajax
            loadMore.click(function(){
                //add the activate class and change the message
                loadMore.addClass('activate').text('Loading...');
                //begin the ajax attempt
                $.ajax({
                    url: 'jquery-version.php',
                    data: {
                        'start': start,
                        'desiredPosts': desiredPosts
                    },
                    type: 'get',
                    dataType: 'json',
                    cache: false,
                    success: function(responseJSON) {
                        //reset the message
                        loadMore.text('Load More');
                        //increment the current status
                        start += desiredPosts;
                        //add in the new posts
                        postHandler(responseJSON);
                    },
                    //failure class
                    error: function() {
                        //reset the message
                        loadMore.text('Oops! Try Again.');
                    },
                    //complete event
                    complete: function() {
                        //remove the spinner
                        loadMore.removeClass('activate');
                    }
                });
            });
        });
    </script>

刪除CSS行:

.post:hover { background-color:lightblue; }

編輯:您可能也要刪除此:

a.post-title:hover { text-decoration:underline; color:#900; }

它發生在以下區域:

.post:hover                 { background-color:lightblue; }

您可以通過以下任一方法刪除懸停顏色:

  • 完全刪除.post:hover行。
  • 刪除.post:hover內部的background-color屬性:( background-color:lightblue;

如果您想進一步了解CSS,請點擊以下鏈接:

CSS簡介-W3Schools

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM