none
coception d'un gadget RRS feed

  • Discussion générale

  • bonjour

    je cherche à creer un gadget pour windows, un genre de calculatrice .

    j'ai pour cela conçu des codes html et css qui marchent très bien.

    le seul souci vient du code js qui pour l'instant testé seulement sous ie11 ne me donne rien.

    code html

    <!DOCTYPE html>

        <html>
        
            <head>
            
                <link rel="stylesheet" type="text/css" href="css/styles/calculette.css">
                <meta content="text/html; charset=utf-8">
            
            </head>
            
            <body>

             <section>

                     <div id="affiche"></div>
        
                <button class="line3 c1" id="sept" onclick="addChar('7')">7</button>
                <button class="line3 c2" id="huit" onclick="addChar('8')">8</button>
                <button class="line3 c3" id="neuf" onclick="addChar('9')">9</button>
                <span class="apart"></span>
                <button class="line3 c4" id="mul" data-op="Setmul" onclick="mul()">*</button>
        
                       
        
                <button class="line2 c1" id="quatre" onclick="quatre()">4</button>
                <button class="line2 c2" id="cinq" onclick="cinq()">5</button>
                <button class="line2 c3" id="six" onclick="six()">6</button>
                <span class="apart"></span>
                <button class="line2 c4" id="sub" data-op="Setsub" onclick="sub()">-</button>
        
                
        
                <button class="line1 c1" id="un" onclick="un()">1</button>
                <button class="line1 c2" id="deux" onclick="deux()">2</button>
                <button class="line1 c3" id="trois" onclick="trois()">3</button>
                <span class="apart"></span>
                <button class="line1 c4" id="div" data-op="Setdiv" onclick="div()">/</button>
                
                    
        
                <button class="line0 c1" id="point" onclick="point()">.</button>
                <button class="line0 c2" id="zero" onclick="zero()">0</button>
                <button class="line0 c3" id="egal" onclick="egal()">=</button>
                <span class="apart"></span>
                <button class="line0 c4" id="add" data-op="Setadd" onclick="add()">+</button>
                
                    
        
                <button class="line4 c1" id="c" onclick="c()">C</button>
                <button class="line4 c2" id="par" onclick="par()">()</button><!--
                <button class="line4 c3" id="egal" onclick="egal()">=</button>
                <span class="apart"></span>
                <button class="line4 c4" id="add" data-op="Setadd" onclick="add()">+</button> -->
            
            </section>

                <script type="text/javascript" src="js/calculette.js"></script>
           </body>
        </html>

    code js


        var par = false;

        var calcul = document.getElementById ('affiche');
        
        function addChar( c){

            var propText = ('textContent' in calcul) ? 'textContent' : 'innerText'; // prise en compte des vieux IE
            calcul [propText] += c;
        
        }

        function pars() {
            
            if (par) {
                calcul.innerHTML += ')';
                par = false;
            }
            
            else {
                calcul.innerHTML += '(';
                par = true;
            }
        
        }
        
        function zero() {
            
                calcul.innerText += '0';
        
        }
        
        function un() {
            
                calcul.innerText += '1';
        
        }
        
        function deux() {
            
                calcul.innerHTML += '2';
        
        }
        
        function trois() {
            
                calcul.innerHTML += '3';
        
        }
        
        function quatre() {
            
                calcul.innerHTML += '4';
        
        }
        
        function cinq() {
            
                calcul.innerHTML += '5';
        
        }
        
        function six() {
            
                calcul.innerHTML += '6';
        
        }
        
        function sept() {
            
                calcul.textContent += '7';
        
        }
        
        function huit() {
            
                calcul.innerHTML += '8';
        
        }
        
        function neuf() {
            
                calcul.innerHTML += '9';
        
        }
           

    code css

    body {
        height: 300px;
        width: 210px;
    }
    section {
        padding-top: 10px;
        width: 210px;
        background-color: #aaaaaa;
        border: 2px solid black;
        height: 300px;
    }
    button {
        width: 40px;
        height: 40px;
        margin: 2.5px;
    }
    * {
        margin: 0px;    
    }
    .c1 {
        margin-left: 10px;
    }
    .c4 {
        margin-right: 10px;
        font-weight: bold;
    }
    .line4 {
        margin-bottom: 10px;
    }
    .line3 {
        margin-top: 10px;
    }
    .apart {
        width: 20px;
        height: 40px;
    }
    #affiche {
        width: 175px;
        height: 20px;
        font-weight: bold;
        text-align: right;
        border: 1px solid black;
        margin: 10px;
        border-radius: 2px;
        background-color: green;
    }
    .line1,.line2,.line3,.line4,.line0 {
        display: inline-block;
    }

    dimanche 13 décembre 2015 14:22

Toutes les réponses

  • Bonjour, lechiwawa,

    Veuillez consulter l'article en bas :
    Analyser la réactivité de l'interface utilisateur (HTML)
    Je vous remercie par avance de votre retour.


    Cordialement,
    Teodora

    Votez! Appel à la contribution TechNet Community Support. LE CONTENU EST FOURNI "TEL QUEL" SANS GARANTIE D'AUCUNE SORTE, EXPLICITE OU IMPLICITE. S'il vous plaît n'oubliez pas de "Marquer comme réponse" les réponses qui ont résolu votre problème. C'est une voie commune pour reconnaître ceux qui vous ont aidé, et rend plus facile pour les autres visiteurs de trouver plus tard la résolution.

    lundi 14 décembre 2015 13:31
    Modérateur
  • J'ai lu , mais suis désolé: je ne vois pas où vous voulez en venir.

    faut-il que je réduise mon js ?

    lundi 14 décembre 2015 18:23
  • Bonjour,

    Je pense que la rubrique courante "Application pour Windows Store" n'est pas adaptée. Vous devriez plutôt poster votre question dans la rubrique "Web Developpement / Internet Explorer". Au passage vous dites que votre code marche très bien mais que vous ne l'avez testé que sur IE11 et que cela ne donnait rien. Si vous souhaitez obtenir une réponse précise à votre question, il faut être plus précis et factuel: 

    • Qu'entendez-vous par "cela ne donne rien" ?
    • Si vous affirmez que votre code marche bien, pouvez-vous préciser dans quel environnement avez-vous constaté  son bon fonctionnement ?

    Cordialement

    Nicolas

    mardi 15 décembre 2015 08:52
  • Bonjour,

    Ah oui il y a encore du boulot.

    Pour démarrer quelques petites remarques :

    • les codes des chiffres se réfèrent à calcul.innerHTML, sauf 1 et 0, qui se réfèrent à calcul.innerText, aussi on ne peut pas ajouter de 1 ni de 0 à l'affichage ; et ça explique peut-être aussi qu'à un moment je me suis retrouvé avec undefined111111 dans calcul.innerText
    • une fonction addChar a été définie, mais pas appelée
    • les codes des boutons d'opérateurs ne sont pas implémentés, celui du C non plus
    • sous IE il existe une barre d'outils de développement, mais je n'ai pas le souvenir de comment on gère le pas à pas avec ça ; un coup d'œil à ce qui se fait sous Firefox (avec la touche F12) peut s'avérer instructif
    • si la prochaine version n'est pas opérationnelle je vois d'ici venir la remarque qu'il existe des supports plus adaptés que les forums pour le développement coopératif



    • Modifié Gloops dimanche 17 janvier 2016 22:00
    dimanche 17 janvier 2016 21:36
  • Si vous affirmez que votre code marche bien, pouvez-vous préciser dans quel environnement avez-vous constaté  son bon fonctionnement ?

    Bonjour,

    A la relecture, il a dit que HTML et CSS fonctionnent bien (et de fait ça n'a pas l'air trop délirant), mais que Javascript lui cause souci.


    • Modifié Gloops dimanche 17 janvier 2016 21:49
    dimanche 17 janvier 2016 21:43