Изменение цвета индикатора выполнения Jquery - PullRequest
1 голос
/ 28 марта 2012

Это мой индикатор выполнения jquery. Я хочу изменить цвет индикатора выполнения с классом Acceptedbar на зеленый и классом Declinedbar на красный

  <head runat="server">
    <title>Idea Storm</title>
    <link href="css/CSS.css" rel="stylesheet" type="text/css" />

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js" type="text/javascript"></script>

    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js"
        type="text/javascript"></script>

    <script src="script/ui.progressbar.js" type="text/javascript"></script>

    ​<style type="text/css">

.AcceptedBar > .ui-progressbar-value {
   background:green;
}

.DeclinedBar > .ui-progressbar-value {
   background: red;
}
</style>
    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/smoothness/jquery-ui.css">
    <%-- <link href="App_Themes/HRIS-Theme/jquery.ui.core.css" rel="stylesheet" type="text/css" />
    <link href="App_Themes/HRIS-Theme/jquery.ui.theme.css" rel="stylesheet" type="text/css" />--%>
</head>

<script type="text/javascript">

    $(function () 
    {
           $('.Accepted').each(function()
            {            
                var valueFromHiddenField = $('input[type=hidden]', this).val();
             $('.Acceptedbar', this).progressbar({ value: valueFromHiddenField});
      });


    });
    $(function () 
    {
       $('.Declined').each(function() {
        // We assume that there is only 1 hidden field under 'pbcontainer'
        var valueFromHiddenField = $('input[type=hidden]', this).val();
       $('.Declinedbar', this).progressbar({ value: valueFromHiddenField });
        });
    });


</script>

Ответы [ 4 ]

6 голосов
/ 28 марта 2012

Вы должны использовать CSS для стилизации ваших индикаторов, подробности о них здесь :

.AcceptedBar > .ui-progressbar-value {
   background: green;
}

.DeclinedBar > .ui-progressbar-value {
   background: red;
}

Рабочий пример здесь

Вы не можете использовать background-color в качестве темы для background-image, поэтому вы должны использовать background

3 голосов
/ 28 марта 2012

используйте вот так ....

    $('.Acceptedbar').css('color','Green');
    $('.Declinedbar').css('color','Red');
0 голосов
/ 28 марта 2012

В файле CSS вы можете написать,

.Acceptbar{color:Green;}
.Declinebar{color:Red;}
0 голосов
/ 28 марта 2012

Вам следует изменить стиль (т. Е. Цвета) в файлах CSS, а не в JavaScript.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...