How to do video-changing animation with mouse click

Question

How to do video-changing animation with mouse click

Navigation

#1 by (1 votes)

1

I have a question, I do not even know how to search for what I want.

The idea is to click on the image of Video 1 and the Video and Title change without leaving the page, so pro 2 and 3. I took a beating in some codes but this actually do not know how to search.

javascript css

asked by anonymous 24.11.2015 / 08:07

1 answer

How to get the url for this Json (java android) Primal numbers using Threads in Python

score 1 · Answer 1

You can do this as follows:

function mostraDiv(num) {
    document.getElementById('div1').style.display='none';
    document.getElementById('div2').style.display='none';
    document.getElementById('div3').style.display='none';
    document.getElementById('div'+num).style.display='block';
}

.hiddenEl{display:none;}

<div class="sidebarContainer">
    <button class="imagens" onclick="mostraDiv('1')">Mostra Div 1</button>
    <button class="imagens" onclick="mostraDiv('2')">Mostra Div 2</button>
    <button class="imagens" onclick="mostraDiv('3')">Mostra Div 3</button>
</div>

<div class="mainContainer">
    <div id="div1">Sou a div1</div>
    <div id="div2" class="hiddenEl">Sou a div2</div>
    <div id="div3" class="hiddenEl">Sou a div3</div>
</div>

Then just make the modifications to your measure, changing the buttons by divs and inserting images inside them as preview thumbnails of the video that the user will see, clicking on the desired image / button and also popular% content% (titles, videos, etc.).

I've created here an example in JSFiddle simple but well thought out how this will work with the respective titles and videos for each button, to get an idea.