1

Estou pesquisando mas não consegui nada que fale a respeito. Já havia feito isso antes, em páginas Web Forms, mas em MVC eu ainda não tinha necessitado. Preciso trocar a imagem de fundo da página a cada vez que ela é carregada. Por exemplo: tenho 10 imagens, e a cada load da _layout.cshtml, está teria que ser carregada com uma das 10 imagens. Fazer o random e pegar a imagem é fácil, o problema e como aplicar o estilo. No Web Forms era fácil, pois eu tinha o código onde eu criava o método e chamava no load da Page. Só que no MVC, eu não tenho load.

Método usado no Web Forms:

  public static void ChangeBGs(HtmlControl oMainBody)
    {
        Random voRandom = new Random();
        int vi = voRandom.Next(1, 10);
        oMainBody.Attributes.Add("style", $"background-image: url('/Background/Fundo ({vi}).jpg')");
    }

Nesse método, eu consigo trocar o estilo do Body da página, pois no WF, eu tenho acesso.

Como fazer algo semelhante no MVC, mais especificamente na _Layout.cshtml. Se eu tiver como aplicar o estilo já criados, e só ir trocando também seria interessante.

Grato.

2 Respostas 2

2

Usando JQuery coloque esse script no _Layout.cshtml.

<script>
    $(document).ready(function() {
        var i = Math.floor(Math.random() * 9) + 1;
        $("body").css("background-image", "url(/Background/Fundo (" + i + ").jpg);");
    }); 
</script>
2
  • Bom dia Augusto. Obrigado pela ajuda. Coloquei o script, mas ele não faz nada. Aonde colocar ele para que seja acionado? 30/01/2019 às 10:40
  • @FernandoM.Davanzo. Você está usando JQuery? Verifique se a linha <script src="https://code.jquery.com/jquery-3.3.1.js" type="text/javascript"></script> está presente no seu layout. 30/01/2019 às 12:05
2

Caríssimos, bom dia.

Já consegui resolver meu problema.

   <script type="text/javascript">
    function Trocar() {
        $(document).ready(function () {
            var oBody = document.getElementById('myBody');
            var i = Math.floor(Math.random() * 9) + 1;
            oBody.style.backgroundImage = "url('../images/Foto" + i + ".jpg')";              
        });
    }
</script>

Grato.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .