una poner imagen fondo div completa como bootstrap javascript jquery drupal parallax

javascript - poner - imagen de fondo css



Obtenga la url de la imagen de fondo de un div inferior para agregarlos a un div superior (1)

Estoy tratando de poner una url de imagen de fondo de un div inferior y agregarlos a un div más alto. El problema es que hay muchos divs inferiores con imágenes de fondo y todos ellos tienen el mismo nombre de clase. En general estoy tratando de construir un tema de paralaje con drupal 7. La visión es transmitir todas mis noticias, poner la imagen de fondo en 100vh, poner el contenido en el medio en un recuadro blanco y dejar que se desplacen en paralaje. Estoy trabajando con vistas. Tengo una vista que muestra todas las noticias con campos: Título, Imagen, Cuerpo. El campo de imagen es un campo de imagen de fondo, por lo que el div en el que se visualiza normalmente tiene la url de la imagen original como background-image-url.

Simplemente no puedo poner la url de .bg-holder en .section.jumbotron. ¿O hay alguna otra solución?

<div class="section jumbotron"> <div class="views-field views-field-title"> <h1 class="field-content"><a href="/drupal/node/4">HEADLINE</a></h1> </div> <div class="views-field views-field-field-image"> <div class="field-content"> <div class="bg-holder" style="background-image: url(http://localhost/drupal/sites/default/files/styles/large/public/field/image/wallhaven-157066.jpg?itok=2BHBQSVa); background-attachment: scroll; background-size: 1903px;"></div> </div> </div> <div class="views-field views-field-body"> <p class="field-content">LOREM</p> </div> </div>

Jfiddle of my Body: http://jsfiddle.net/anLL1uop/2/


No estoy seguro de que entienda al 100% tu pregunta, pero para cambiar el fondo de ''jumborton'', a la de un titular específico de bg, le daría a cada uno una identificación única, para que todos puedan tener el mismo estilo (desde son de la misma clase), pero el ID le permite decirle a jQuery qué imagen de fondo desea. También establecería la imagen de fondo para cada uno en el archivo css, en lugar de hacer

<div style="background-image: url(...);"

Aquí hay un jsfiddle que muestra lo que quiero decir. Tiene el jQuery necesario para cambiar el fondo del jumbotron al del div cliqueado, usando su id. https://jsfiddle.net/mahmudzero/anLL1uop/23/