五星好評外掛 js + html +css

阿新 • • 發佈：2018-11-03

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        *{
            margin:0;
            padding:0;
        }

        .box{
            margin: 20px auto;
            height: 50px;
            width 
: 300px;
        }
        .box .comment{
            font-size: 30px;
            color: orange;
        }

        .comment li{
            float: left;
            cursor: pointer;
        }

        ul{
            list-style: none;
        }

    </style>
</head>
<body>
    <div 
 class="box">
        <ul class="comment" name="xingji">
            <li value="1">☆</li>
            <li value="2">☆</li>
            <li value="3">☆</li>
            <li value="4">☆</li>
            <li value="5">☆</li>
        </ul 
>
    <input type="text" value="" id="aaa">
    </div>
</body>
</html>
<script src="jquery.min.js"></script>
<script>
    $(function(){
        var wjx_none = '☆'; // 空心五角星
        var wjx_sel = '★'; // 實心五角星

        //滑鼠移進變實星
        $(".comment li").on("mouseover",function(){
            $(this).text(wjx_sel).prevAll("li").
            text(wjx_sel).end().nextAll().text(wjx_none);
            $("#aaa").val($(this).val());

        });

        //滑鼠移出變空星
        $(".comment li").on("mouseout",function(){
           if($("li.current").length === 0){
                $(".comment li").text(wjx_none);
           }else{
               $("li .current").text(wjx_sel).prevAll().text(wjx_sel).end().nextAll().text(wjx_none);
           }
        });

        //滑鼠點選保持當前狀態
        $(".comment li").on("click",function(){
            $(this).attr("class","current").siblings().removeClass("current");

            $("#aaa").val($(this).val());
            // alert($(this).val());
        });


    });
</script>

記得引入jquery哦~~~

五星好評外掛 js + html +css

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style&g

五星好評外掛 js + html +css

$(function(){ var wjx_none = '☆'; // 空心五角星 var wjx_sel = '★'; // 實心五角星 //滑鼠移進變實星 $(".comment li").on("mouseover",func

照片墻效果---->能成功運行。js+html+css

照片 function parent <!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>My照片墻</title> <style ty

js+html+css實現本地聊天室

歡迎訪問我的個人部落格：http://mrzyf.club. 程式碼完成效果：話不多說，直接上程式碼—— css程式碼： <style type="text/css"> &nb

滑動固定表格頭和列--js,html,css--移動端--基於Iscroll

簡單實現固定表格頭和列。之前做了一個表格固定頭和列的，分享一下程式碼和思路。 1.滑動僅固定頭或列 2.滑動即可固定頭，也可固定列。（滑動固定其他地方也可參考。） 1. 僅固定列，或頭。用定位，但需注意，固定列和表格內容寬或高匹配。程式碼： <style

使用Sublime Text 3的HTML-CSS-JS Prettify外掛格式化程式碼

之前用 Sublime Text 格式化程式碼的時候，安裝過 HTML-CSS-JS Prettify 這個外掛，但格式化時卻會提示（預設路徑未找到Node.js）雖然完全不知道 Node.js 怎麼用，但沒關係，只管安裝就好。下載安裝到Node.js （地址

HTML | CSS | JS-隨筆目錄

width ava strong height body left tro rip tab HTML CSS JavaScript HTML | CSS | JS-隨筆目錄

Sublime text 3 格式化HTML/css/js/json代碼插件

快捷 ctrl+alt ctr install nbsp 重新安裝 -c pack JsFormat：這裏下載這插件包 https://github.com/sprinng/JsFormat ，點油下角的zip就能下載插件包放到sublime安裝目錄的Data\P

HTML+CSS+JS（面試題）

pagex innerhtml ado 傳值優缺點釋放如何 blog 們的 1、你做的頁面在哪些流覽器測試過？這些瀏覽器的內核分別是什麽? IE: trident內核 Firefox：gecko內核 Safari:webkit內核 Opera:以前是presto內核

JS 對html標簽的屬性的幹預以及JS 對CSS 樣式表屬性的幹預

inpu cti doc tel tex ttext button abcd element -任何標簽的任何屬性都可以修改! -HTML裏是怎麽寫, JS就怎麽寫以下是一段js 作用於 css 的 href的代碼 <link id="l1"

maven jetty 啟動後，不能修改靜態文件，js，css，html

9.4 拷貝 ram 啟動 maven pom jar包 conf text 解決辦法： 1.從jetty的jar包中（位置可能不同，有的jetty-web中）拷貝一份webdefault.xml文件 2.將webdefault.xml 中的useFileMappedBuf

flask前端優化：css/js/html壓縮

flask sta ask 技術分享 all 時間減少 ges 技術 1、先壓縮再傳輸，可以減少傳輸的大小，減少傳輸時間，但是壓縮需要時間，所以最終頁面顯示是快了還是慢了，需要比較 2、先看html壓縮模塊：pip install Flask-HTMLmin 壓縮前：大小

前端基礎（HTML+CSS+JS）-day12

轉載 xhtml 規範 pla desc 響應狀態 pos 怪異 splay 寫在前面上課第12天，打卡：　　　　理想三旬；前言 HTTP協議：短連接：因為服務器的鏈接數是有限的。如果一直維持一個長鏈接，那麽資源會很快就被耗盡；

能用HTML/CSS解決的問題就不要使用JS！

web前端 js為什麽說能使用html/css解決的問題就不要使用JS呢？兩個字，因為簡單。簡單就意味著更快的開發速度，更小的維護成本，同時往往具有更好的體驗，下面介紹幾個實例。1. 導航高亮導航高亮是一種很常見的問題，包括當前頁面的導航在菜單裏面高亮和hover時高亮。你可以用js控制，但是用一點CSS技巧

HTML+CSS+JS簡單實現支付寶付款界面效果

6.5 body pre -c css brush ges line col HTML+JS部分 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

前端學習html css js

content insert 超鏈接 getc ret js面向對象 css語法 jsonp 代理模式 html 第一章：HTML模板 HTML是什麽（超文本標記語言） HTML網頁主體結構 doctype標簽 head標簽 meat標簽 title標簽 body標簽

html css js書寫規範

測試工具 data- float 頁面性能 doc css3 建議註意英文字母無論是從技術角度還是開發視角，對於web前端開發規範文檔都有一定規範，本文就css3和html5的發展前景總結了一系列的web開發文檔，僅供大家參考。規範目的：為提高團隊協作效率, 便於後臺

前端（HTML/CSS/JS）-JavaScript編碼規範

resource htm 容易 blog 語境 asc 也有命名方式分享 1. 變量命名（1）變量名不應以短巧為榮左邊的變量名都不太清楚，代碼的擴展性不好，一旦代碼需要加功能的話，就容易出現obj1、obj2、obj3這種很抽象的命名方式。所以一開始就要把變

html+css+js(+JQuery)制作撲克牌圖片切換效果

css jquery 要實現的效果圖：先把靜態頁面寫出來： index.html <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Co

HTML+CSS+JS

html+css logs title color 單標簽 www htm OS link HTML 表格標簽表單標簽HTML+CSS+JS

五星好評外掛 js + html +css

相關推薦