Staff en línea

[javascript] poner un boton en el editor de calculadora
Tema iniciado por y Añadir a favoritos

staff
[codebox]Pues eso, un boton que al dar click saque una calculadora[/codebox]
Primero creas una pagina html

Código:

<form name="calc">

    <table style="text-align: center;" border="2">

        <tbody>

            <tr>

                <td colspan="4">
                    <input name="display" type="text" />
                </td>

            </tr>

            <tr>

                <td>
                    <input onclick="calc.display.value+='0'" value="0" type="button" />
                </td>

                <td>
                    <input onclick="calc.display.value+='1'" value="1" type="button" />
                </td>

                <td>
                    <input onclick="calc.display.value+='2'" value="2" type="button" />
                </td>

                <td>
                    <input onclick="calc.display.value+='+'" value="+" type="button" />
                </td>

            </tr>

            <tr>

                <td>
                    <input onclick="calc.display.value+='3'" value="3" type="button" />
                </td>

                <td>
                    <input onclick="calc.display.value+='4'" value="4" type="button" />
                </td>

                <td>
                    <input onclick="calc.display.value+='5'" value="5" type="button" />
                </td>

                <td>
                    <input onclick="calc.display.value+='-'" value="-" type="button" />
                </td>

            </tr>

            <tr>

                <td>
                    <input onclick="calc.display.value+='6'" value="6" type="button" />
                </td>

                <td>
                    <input onclick="calc.display.value+='7'" value="7" type="button" />
                </td>

                <td>
                    <input onclick="calc.display.value+='8'" value="8" type="button" />
                </td>

                <td>
                    <input onclick="calc.display.value+='*'" value="x" type="button" />
                </td>

            </tr>

            <tr>

                <td>
                    <input onclick="calc.display.value+='9'" value="9" type="button" />
                </td>

                <td>
                    <input onclick="calc.display.value=''" value="C" type="button" />
                </td>

                <td>
                    <input onclick="calc.display.value=eval(calc.display.value)" value="=" type="button" />
                </td>

                <td>
                    <input onclick="calc.display.value+='/'" value="/" type="button" />
                </td>

            </tr>

        </tbody>

    </table>
</form>
Luego el JS
[hidecode]
Código:


$(function() {
  if (!$.sceditor) return;
 
  $.sceditor.command.set('calculator', {
    dropDown : function(editor, caller, callback) {
      var d = document.createElement('DIV');
   
      d.innerHTML = '<iframe src="AQUI EL URL DE LA PAGINA" width="100" height="100" scrolling="no" border="no"></iframe>';
     
      editor.createDropDown(caller, 'calculator', d);
    },
 
    exec : function(c) {
      var e = this;
      $.sceditor.command.get('calculator').dropDown(e, c, function(content) {
        e.insertText(content);
      });
    },
 
    txtExec : function(c) {
      var e = this;
      $.sceditor.command.get('calculator').dropDown(e, c, function(content) {
        e.insertText(content);
      });
    }
  });
 
  toolbar += ',calculator'
});
}
[/hidecode]
POR ULTIMO EL CSS
Código:

.sceditor-button-calculator div {
  background-image:url(https://cdn2.iconfinder.com/data/icons/freecns-cumulus/16/519630-131_Calculator-16.png)!important;
Chalo
avatar

¿Que estoy pensando? :

vamos a hacer cosas geniales :) [table class=fecha_up][td]Se modifico:24/05/18 - 11:11 hrs. [/td][/table]


Banner en temas :

https://coverfiles.alphacoders.com/322/32281.jpg


Color de titulos :

#fff


Sombra titulo :

0 0 1px #000


Mensajes :

6712


Puntos :

8776


Me gusta :

1007


ingreso :

17/04/2014


Sexo :

Masculino

Plataforma :

phpbb3


Navegador :

chrome


Ver perfil de usuario https://www.opensourcephpbb3.com

Volver arriba Ir abajo

 En la misma categoria


Permisos de este foro:
No puedes responder a temas en este foro.