Streaming live at 10am (PST)

Webflow transition doesn't work with dynamic div


#1

Hi,

I’m having dynamic div with angular ng-reapeat (also i tried to append my div in Jquery as well) but i couldn’t make as per my requirement. It’s working fine when i add multiple div statically.

<div class="res-card">
    <div class="div-block"></div>
    <div class="div-block-2" data-ix="new-interaction">
        <div class="text-block">--</div>
        <div data-animation="slide" data-duration="500" data-infinite="1" class="slider w-slider">
            <div class="w-slider-mask">
                <div class="slide w-slide">
                    <div class="jumbotron">
                        <h1>Jumbotron1.1</h1>
                        <p>This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
                        <p><a class="btn btn-primary btn-lg">Learn more</a></p>
                    </div>
                </div>
                <div class="slide-2 w-slide">
                    <div class="jumbotron">
                        <h1>Jumbotron1.2</h1>
                        <p>This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
                        <p><a class="btn btn-primary btn-lg">Learn more</a></p>
                    </div>
                </div>
            </div>
            <div class="w-slider-arrow-left">
                <div class="w-icon-slider-left"></div>
            </div>
            <div class="w-slider-arrow-right">
                <div class="w-icon-slider-right"></div>
            </div>
            <div class="w-slider-nav w-round"></div>
        </div>
    </div>
</div>



<div ng-repeat="item in vm.data">
    <div class="res-card">
        <div class="div-block"></div>
        <div class="div-block-2" >
            <div class="text-block">--</div>
            <div data-animation="slide" data-duration="500" data-infinite="1" class="slider w-slider">
                <div class="w-slider-mask">
                    <div class="slide w-slide">
                        {{item.value}}
                    </div>
                    <div class="slide-2 w-slide">
                        {{item.id}}
                    </div>
                </div>
                <div class="w-slider-arrow-left">
                    <div class="w-icon-slider-left"></div>
                </div>
                <div class="w-slider-arrow-right">
                    <div class="w-icon-slider-right"></div>
                </div>
                <div class="w-slider-nav w-round"></div>
            </div>
        </div>
    </div>
</div>     

<div class="div-block-3"></div>

#2

Is this webflow transition available in angular 5?