CODEWITHSUNDEEP
jquerycss
Mr A
Mr A

Reputation: 6778

Changing Background colour using jquery

I want to change the background color of the page when the model.id is greater then the value 50 so for instance 

@if(Model.Id > 50)
 {Add this background-color: #CA422B to the style picture class}

How can i do this by using jquery

Upvotes: 1

Views: 255

Answers (2)

Rory McCrossan
Rory McCrossan

Reputation: 337700

I assume from the syntax this is Razor in ASP.Net MVC 3? In which case jQuery is not required here as the value is coming from the Model, and thefore not dynamic. HTML and CSS will work fine.

The first thing to do would be to create the CSS classes in your stylesheet which sets the relevant colours:

.foo {
    background-color: #CA422B;
}
.bar {
    background-color: #C00;
}

Then put the following logic to your view/partial to add the class when needed:

<body class="@(Model.Id > 50 ? "foo" : "bar")">

The foo class with be used where Id > 50, otherwise the bar class will be.

Edit
To add a second class, and give it a value from the model, try this:

<div class="@(Model.Id > 7 ? "picture-9999" : "picture-" + Model.Id)">

Upvotes: 2

dknaack
dknaack

Reputation: 60556

Try this

@if(Model.Id > 50) {
    $('body').css('background-color','#CA422B')
}

hope this helps

Upvotes: 1

Related Questions