Sujet Précédent Sujet Suivant

Adapter et redimensioner 4 players

Napola Messages postés 7 Date d'inscription vendredi 11 septembre 2015 Statut Membre Dernière intervention 29 octobre 2015 - 11 sept. 2015 à 10:10
Napola Messages postés 7 Date d'inscription vendredi 11 septembre 2015 Statut Membre Dernière intervention 29 octobre 2015 - 11 sept. 2015 à 12:56

Bonjour,
J'ai 4 players à l'horizontale dans mon wrapper qui fait 1300px.
j'ai besoin qu'après avoir visualisé 1 player il disparaîsse en fondu et que les 3 autres se recentre, et ainsi de suite jusqu'au moment où il n'en reste plus qu'1 en plein ecran.
Merci de bien vouloir me donner une piste pour avancer. J'ai fait une page HTML pour chaque étape, et une feuille de style, mais j'arrive pas à les recentrer et je pense qu'il y a plus simple.
Merci à tous

A voir également:

Adapter et redimensioner 4 players
Errordomain=nscocoaerrordomain&errormessage=impossible de trouver le raccourci spécifié.&errorcode=4 ✓ - Forum Javascript / DHTML
Adapter l'affichage web - Forum Javascript / DHTML
Bloc-notes 4 sujet - Forum VB.NET
Supprimer 4 lettres ✓ - Forum Visual Basic
Raccourci conditionel ✓ - Forum C# / .NET

2 réponses

Réponse 1 / 2

cgandco Messages postés 219 Date d'inscription mercredi 26 octobre 2011 Statut Membre Dernière intervention 22 juin 2017 9
11 sept. 2015 à 12:15

Bonjour,

Comme tu as des dimensions fixes, c'est plus facile.

inspire toi de ça:

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <style type="text/css" >
        #wrapper
        {
            width:1300px;
            background-color:red;
        }
        .player
        {
            width:300px;
            height:250px;
            background-color:cornflowerblue;
            display:inline-block ;
            margin-left:80px;
        }

    </style>
    <script type="text/javascript" >
        function close3()
        {
            var el3 = document.getElementById("p3");
            el3.style.display = "none";
            var el2 = document.getElementById("p2");
            var el1 = document.getElementById("p1");
            el2.onclick = close2;
            el1.style.marginLeft = "233px";
            el2.style.marginLeft = "233px";
        }
        function close2()
        {
            var el2 = document.getElementById("p2");
            el2.style.display = "none";
            var el1 = document.getElementById("p1");
            el1.style.marginLeft = "500px";
            
        }
    </script>
</head>
<body>
    <div id="wrapper">
        <div id="p1" class="player"></div>
        <div id="p2" class="player" ></div>
        <div id="p3" class="player" onclick="close3();"></div>
    </div>
</body>
</html>

bonne journée

Réponse 2 / 2

Napola Messages postés 7 Date d'inscription vendredi 11 septembre 2015 Statut Membre Dernière intervention 29 octobre 2015
11 sept. 2015 à 12:56

Merci beaucoup je vais tester et poursuivre.
Bonne journée

Discussions similaires

Problème de configuration

exception asp.net

problème avec web config

Création d'un raccourci

Comment connaitre les 4 derniers caractères d'une textbox

Votre réponse

Discussions similaires