CODEWITHSUNDEEP
jquerycss
Mohamed Samy
Mohamed Samy

Reputation: 941

Insert Value in css line

I'm trying to add the padding-top value to the css that I append in the header , but only color is working:

        var PaddingTOp = $('#PaddingTOp').val();
        var PaddingRight = $('#PaddingRight').val();
        var PaddingBottom = $('#PaddingBottom').val();
        var PaddingLeft = $('#PaddingLeft').val();

        //Class Name
        $("<style type='text/css'> .redbold{ color:#f00; padding-top: PaddingTOp ;} </style>").appendTo("head");
        $(".container").addClass("redbold");

Upvotes: 2

Views: 47

Answers (2)

vijayP
vijayP

Reputation: 11512

$("<style type='text/css'> .redbold{ color:#f00; padding-top: "+PaddingTOp+" ;} </style>").appendTo("head");

Upvotes: 2

vijayP
vijayP

Reputation: 11512

    var PaddingTOp = $('#PaddingTOp').val();
    var PaddingRight = $('#PaddingRight').val();
    var PaddingBottom = $('#PaddingBottom').val();
    var PaddingLeft = $('#PaddingLeft').val();

    //Class Name

    var cssToApply = "color:#f00;";
    $.trim(PaddingTOp).length > 0 ?  cssToApply + "padding-top:"+PaddingTOp +";" : "";
    $.trim(PaddingRight ).length > 0 ?  cssToApply + "padding-right:"+PaddingRight +";" : "";
    $.trim(PaddingBottom ).length > 0 ?  cssToApply + "padding-bottom:"+PaddingBottom +";" : "";
    $.trim(PaddingLeft ).length > 0 ?  cssToApply + "padding-left:"+PaddingLeft +";" : "";

    $("<style type='text/css'> .redbold{ "+ cssToApply +"} </style>").appendTo("head");
    $(".container").addClass("redbold");

Upvotes: 0

Related Questions