javascript style Obtenez l'URL de l'image d'arrière-plan à partir d'une div inférieure pour les ajouter à une div plus élevée



style.background javascript (1)

Im essayant de mettre une URL d'arrière-plan d'un div inférieur et les ajoute à un div plus élevé. Le problème est, il y a beaucoup de divs inférieurs avec des images d'arrière-plan et tous ont le même nom de classe. Dans l'ensemble Im essayant de construire un thème de parallaxe avec drupal 7. La vision est de diffuser toutes mes nouvelles, mettre l'image de fond sur 100vh, mettre le contenu au milieu dans une boîte blanche et laissez-les parallax défiler. Je travaille avec des vues. J'ai une vue qui affiche toutes les nouvelles avec des champs: Titre, Image, Corps. Le champ d'image est un champ d'image d'arrière-plan, de sorte que la div où sa valeur normale est affichée a l'URL d'image originale en tant qu'arrière-plan-image-URL.

Je ne peux pas mettre l'url de .bg-holder dans .section.jumbotron. Ou y a-t-il une autre solution?

<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 de mon corps: http://jsfiddle.net/anLL1uop/2/


Je ne suis pas sûr de comprendre à 100% votre question, mais pour changer le contexte de 'jumborton', à celui d'un bg-holder spécifique, je donnerais à chacun un identifiant unique, afin qu'ils puissent tous avoir le même style (depuis ils sont de la même classe), mais l'ID vous permet de dire à jQuery quelle image d'arrière-plan vous voulez. Je voudrais également définir l'image de fond pour chacun d'eux dans le fichier css, par opposition à faire

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

Voici un jsfiddle qui vous montre ce que je veux dire. Il a le jQuery nécessaire pour changer l'arrière-plan du jumbotron à celui du div cliqué, en utilisant son id. https://jsfiddle.net/mahmudzero/anLL1uop/23/