jquery之css()改變字體大小,顏色,背景色


轉:

<script type="text/javascript">
$(document).ready(function() {
        $("#fontsize").change(function(){
                var size = $("#fontsize").val();//獲取下拉框的值
                $("p").css({"font-size":size }); //把值付給css的font-size
        });
        $("#backgroundcolor").change(function(){
                var backgroundcolor = $("#backgroundcolor").val();
                $("p").css({"background":backgroundcolor});
        });
        $("#fontcolor").change(function(){
                var fontcolor = $("#fontcolor").val();
                $("p").css({"color":fontcolor});
        });
});

</script>
        <label for="fontsize">字體大小</label>
        <select id="fontsize">
                <option value="12px">小號</option>
                <option value="14px">較小</option>
                <option value="16px" >中號</option>
                <option value="18px">較大</option>
                <option value="24px">大號</option>
        </select>

        <label for="backgroundbackground">背景顏色</label>
        <select id="backgroundcolor">
                <option value="#F4FBFF">默認</option>
                <option value="gray">淡灰</option>
                <option value="red">紅色</option>
                <option value="green">綠色</option>
        <option value="yellow">明黃</option>
        </select>

        <label for="fontcolor">字體顏色</label>
        <select id="fontcolor">
                <option value="#000000">黑色</option>
                <option value="#ff0000">紅色</option>
                <option value="#006600">綠色</option>
                <option value="#0000ff">藍色</option>
        <option value="#660000">棕色</option>
        </select>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM