input要素を使ったマークアップについて

投稿者: Anonymous _x000D_ _x000D_ <style>_x000D_ .show {_x000D_ display:none;_x000D_ }_x000D_ _x000D_ input:checked ~ .show {_x000D_ display:block;_x000D_ }_x000D_ </style>_x000D_ _x000D_ <input id=”on-off” type=”checkbox”>_x000D_ <label for=”on-off”>表示する</label>_x000D_ <p class=”show”>表示される(通常時display:none)</p> _x000D_ _x000D_ _x000D_ ご回答頂けると幸いです。 このように何かを表示を切り替える際にinput要素を使用することは、 マークアップ的には間違いなのでしょうか。 最も適切な使用方法としてはformタグ内でデーター送信のために用いることだとは存じていますが、私は明らかな間違いではないと現時点では思っています。 input要素はformを構成する要素としてフォーム部品ともしばしば説明されていますが、 HTML Living StandardやMDNを見る限りではform内の使用に限定されている訳でもなく、 inputタグ単品での説明からはユーザーからの選択やコントロール、データを受ける要素という認識を受けました。 このようなマークアップに至った経緯を申しますと、この程度ならjavascriptで記述しなくてもいいのでは無いか?と思った次第です。script記述量は少しでも少ない方が読み込みの面でも良いと思いましたので… 同じエンジニアの方と意見が割れたので質問させていただきました。 解決 HTML5 4.10 Froms 4.10.1 Introductionには次の一文があります。 No client-side scripting is needed in many cases, though an…(Continue Reading)

html2canvasでキャプチャした画像が空になる

投稿者: Anonymous html2Canvasの DOMを画像に書き出す方法 を参考にさせていただき、コードを書いたのですが、 スクリーンショットを撮るボタンを押しても、空の画像ファイルが生成されるだけです。 クリアボタンも効きません…。 私が、ターゲットとなるdivの中で、img srcにphp変数を使用しているからなのでしょうか? しかしローカルファイルに置換してもダメでした。 <div id=”target_screen”> <?php echo “<img class=”effectedImage” src=”$image”>”; ?> </div> テストとして、この画面下部にスクリーンショットを表示しようとしていますが、 最終的には、取得した画像を別のphpへpostしたいと考えています。 ご教授願います。 解決 HTMLページと同じオリジン(由来、大抵ドメインで決まります)の画像を使用していますか? Canvas要素に別オリジンの要素を描画した場合、そのCanvas要素の内容は取り出せなくなります。 セキュリティ上の制約です。 この制約がないと、本人しか閲覧できないはずの写真をJavaScriptで盗む、といった事が可能になるからです。 自分が所有しているサーバ同士であれば、同じオリジンとして扱う方法もあるようです。https://developer.mozilla.org/ja/docs/Web/HTML/CORS_enabled_image 回答者: Anonymous

Posicionar un radio button con imagen al lado del otro dentro de modal

publicado por: Anonymous No estoy pudiendo resolver el problema en el que aparece un radiobutton debajo del otro. Quiero colocarlo a la derecha del primero dentro del modal. Así me aparece: Y acá está el HTML de esa parte: <div class=”cc-selector”> <input checked=”checked” id=”visa” type=”radio” name=”credit-card” value=”visa” /> <label class=”drinkcard-cc visa” for=”visa”> <img src=”<?php echo…(Continue Reading)

javascriptが動きません

投稿者: Anonymous 前提・実現したいこと javascriptでリアルタイムの計算がしたい 発生している問題・エラーメッセージ 定価と掛け率を掛けた結果を単価に表示させたいのですがうまくいきません。 該当のソースコード <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>(アプリ名)</title> <link rel="stylesheet" href="/distributor_system/css/reset.css"> <link rel="stylesheet" href="/distributor_system/css/style.css"> </head> <body> <div id="wrapper"> <div id="header"> <h1>(アプリ名)</h1> </div> <div id="content"> <h2>職人Aの単価</h2> <form method="POST" action="/distributor_system/wholesales/new"> <table> <tbody> <tr> <th>品番</th> <th>定価</th> <th>掛け率</th> <th>単位</th> <th>単価</th> </tr> <tr> <td><input type="text" name="product_number" value=""></td> <td><input id="input01" type="text" name="normal_price" value="" /></td>…(Continue Reading)

ブラウザの多重クリック防止

投稿者: Anonymous CGIを使って、Webサーバー内のコマンドを実行したいのですが、クライアント側での多重クリックを防ぐためWebブラウザ上でボタンクリック後、一定期間ボタンを無効にするようなことは出来るでしょうか? 解決 可能です。 ボタンクリック直後にボタンを無効にした後、setTimeout等で一定時間経過後にボタンの無効を解除するとよいと思います。 回答者: Anonymous

¿Cómo agregar dinámica un fragmento de html dentro de un div?

publicado por: Anonymous ¿Cómo puedo hacer que un fragmento de codigo html lo pueda agregar de forma dinámica por medio de JavaScript o jQuery, tengo el siguiente código HTML: <section class=”flex-container”> <div class=”flex-item”><img class=”Imagenes” src=”img/actualizar.png” title=”Actualizar” onclick=”Actualiza();”/></div> <div class=”flex-item”><img class=”Imagen” src=”img/cloud.png” title=”Descargar archivos TXT” onclick=”Click();”/></div> </section> El fragmetno que quiero agregar es el siguiente: <div…(Continue Reading)

Coordinar barra lateral y navegador co bootstrap

publicado por: Anonymous Buenas! Lo primero de todo soy un supernoob con páginas web y he tomado la mala decisión de usar bootstrap en mi primer proyecto de la universidad, así que agradecería todo consejo que podáis darme :3 Estoy haciendo una plantilla de la barra de navegación y la barra lateral y quiero que…(Continue Reading)

obtener textbox de ventana modal en otra nueva

publicado por: Anonymous alguien sabe como obtener el valor de una caja de texto de una ventana modal en otra nueva ventana modal? tengo una ventana modal que tiene dos botones, tambien tengo un valor clave en un textbox que necesito recuperar en otra ventana modal para procesar ese valor, trataba de pasar el valor…(Continue Reading)

:before, :after 疑似要素をコピーさせることができるか?

投稿者: Anonymous CSSでスタイル付けをしている際にリストの先頭にそれぞれ共通するテキストがあるのでこれを擬似要素で作ろうと思いました li::before { content: “共通テキスト”; } <ul> <li>項目A</li> <li>項目B</li> <li>項目C</li> </ul> そのままだと擬似要素のテキストだけコピーできないようなのですがなぜコピーできないのでしょうか? 追加のCSSかJSを使う必要がありますか?それとも擬似要素以外を使う方がいいですか? ※開発者ツールを使えば選択できるようです 解決 なぜ before, after 擬似要素のテキストがコピー出来ないのか before, after 擬似要素のテキストがコピー出来ない理由は、端的にいえば、ドキュメントツリーにそれらの内容が存在しないからです。以下でもう少し詳細に説明します。 まず、 Cascading Style Sheets Level 2 Revision 2 の 12 章によれば、コンテンツは 2 つの方法により生成されます。1 つは content プロパティを持つ before, after 擬似要素により生成され、もう 1 つは display プロパティに list-item 値を持つ要素により生成されます。 12 Generated content, automatic numbering, and…(Continue Reading)

¿Como usar correctamente el evento click en Javascript?

publicado por: Anonymous Buen dia No entiendo cual es el error,lo que quiero es que al tocar en Hola cambie a Mundo _x000D_ _x000D_ function cambiardiv(){_x000D_ var i=document.getElementById(“a”).click=”Mundo”_x000D_ }_x000D_ window.onload=cambiardiv; _x000D_ <!DOCTYPE html>_x000D_ <html lang=”es”>_x000D_ <head>_x000D_ <meta charset=”UTF-8″>_x000D_ _x000D_ <title>Document</title>_x000D_ <script src=”eventoclick_ext.js”></script>_x000D_ </head>_x000D_ <body>_x000D_ <div id=”a”>Hola</div>_x000D_ </body>_x000D_ </html> _x000D_ _x000D_ _x000D_ Tambien me gustaria saber…(Continue Reading)

Error en Calculadora HTML5: TypeError: Cannot set property ‘onclick’ of null

publicado por: Anonymous Creo que el problema esta en la declaración de variables el código aun no esta completo ya que falta funciones por asignar pero las funciones básicas no me están funcionando ej: suma, resta, multiplicación y divicion. con ellos los números. PD: tambien puede ser problema con el codigo de la pantalla pero…(Continue Reading)

¿Hacer funcionar un required? HTML5

publicado por: Anonymous chicos! Seré breve, estoy haciendo un formulario básico en HTML del tipo “Regístrese aquí”, algunos input los tiro con atributo ‘required’, pero al probarlo no me funcionan. Dejo ejemplo. <!DOCTYPE html> <html lang=”en”> <head> <meta charset=”UTF-8″> <link rel=”stylesheet” href=”css/estilos.css”> <title>Regístrese aquí</title> </head> <body> <form action=”Registrar.php” class=”formulario”> <h1 class=”titulo”>Regístrese Aquí</h1> <div> <label for=”nombres”>Nombres:…(Continue Reading)

Limpiar Inputs y TextArea de un formulario en un Modal de Bootstrap

publicado por: Anonymous El código de la tabla con los botones es el siguiente: <table class=”table table-striped”> <thead> <tr> <th>Fecha</th> <th>Título</th> <th>Estado</th> <th>Comentarios</th> <th> Acciones&nbsp;&nbsp;&nbsp;&nbsp;<button type=”button” class=”btn btn-success” data-toggle=”modal” data-target=”#modal” id=”btn-noticia” onclick=”limpiarFormulario();”>Crear noticia</button> </th> </tr> </thead> <tbody> <?php for ($i = 0; $i < count($noticias); $i++) { $noticia_actual = $noticias[$i][0]; $comentarios_noticia_actual = $noticias[$i][1]; ?> <tr>…(Continue Reading)

Como incluir JQuery en el html

publicado por: Anonymous Estoy intentando incluir un css desde un link externo, pero no logro conseguirlo. <head> <link rel=”stylesheet” href=”https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css”> <link rel=”stylesheet” type=”text/css” href=”style.css” media=”screen” /> </head> ¿Alguna idea, o acotación? Así es como se ve mal: Y así es como debería verse: solución En efecto la forma correcta de añadir hojas de estilos externos…(Continue Reading)

¿Cómo crear button anterior y siguiente con jQuery/css?

publicado por: Anonymous Cómo añado dos botones ( < ) ( > ), uno a la derecha y otro a la izquierda. Funcionalidad jQuery anterior y siguiente. Ejemplo: Código slider jsfiddle. solución En base al ejemplo publicado, puedes hacer lo siguiente. En tu HTML: agrega dos enlaces, a tu gusto, que representarían las flechas izquierda…(Continue Reading)

Como validar un input solo puedan entrar decimales

publicado por: Anonymous tengo el siguiente problema, en un campo input solo se pueden entrar numeros decimales con dos numeros despues del punto. ejemplo 5.25 o 132.50 he intentado con lo siguiente por no he resuelto: function ValidateMoney(_id) { var amount = document.getElementById(_id).value; var patron = /^(d+|d+.d{2})$/; if (!patron.test(amount)) { window.alert(‘cantidad ingresada incorrectamente’); document.getElementById(‘amount’).focus(); return…(Continue Reading)

¿Como alinear imágenes html con css, en: varias filas y colocando en cada una de ellas, de 3 a 4 imágenes alineadas?

publicado por: Anonymous Intento desde wordpress insertar y alinear imágenes colocando de 3 a 4 en cada fila, ejemplo: ¿Como hacerlo con CSS, y ponerle la propiedad para que se vea responsive? _x000D_ _x000D_ <img> <img> <img> <img>_x000D_ <img> <img> <img>_x000D_ <img> <img> <img> <img>_x000D_ <img> <img> <img> _x000D_ _x000D_ _x000D_ _x000D_ _x000D_ <img src=”http://foroam.com/wp-content/uploads/2017/02/CMIC_Fondo-de-fondos_logo_baja.jpg”…(Continue Reading)

Como puedo saber el ancho de pantalla en donde se esta abriendo la pagina web?

publicado por: Anonymous Estoy haciendo unas pruebas iniciales ya en el estado de producción. Todas las páginas del proyecto cargan en el inicio lo siguiente: <style> body { padding-left: 30px; padding-right: 30px; } </style> Lo estuve probando un dispositivo movil y se ve bien, en una PC perfecto. Ahora bien, cuando cargo formularios de ingreso…(Continue Reading)

Como saber el numero de la fila de una de html que he seleccionado

publicado por: Anonymous Buen día, tengo un codigo que genera una tabla segun los meses que selecciono con un determinado vector que puede ser cualquier número, entonces al darle en el botón guardar, se genera una tabla con la funcion de javascript, osea guardo los meses en un array y genero una tabla con los…(Continue Reading)

¿Cómo puedo hacer que un textarea haga un salto de linea cada cierta cantidad de caracteres?

publicado por: Anonymous Tengo un <textarea> en un formulario, en el cual se escriben notas de la información añadida, la cuestión es que sí el usuario no le da manualmente enter no hace un salto de linea y la información queda totalmente recta, eso va a una tabla y esa tabla por acomodar ese texto,…(Continue Reading)

¿Como aplicar transformaciones CSS3 a un elemento padre sin afectar los elementos hijos?

publicado por: Anonymous Necesito aplicar una transformación de scale y skew a un div, pero al realizar dicha transformación resulta que también se le aplica a los elementos hijos. ¿Como hago para que los elementos hijos omitan esa propiedad? solución Realmente, como ya te han comentado, se podría realizar esto simplemente revirtiendo el valor de…(Continue Reading)

¿Como puedo agregar un botón de “ver más” en este bloque de código?

publicado por: Anonymous He estado intentando agregar un botón de “ver más” pero no consigo que funcione ninguno de los que he probado hasta ahora, esté es mi HTML: _x000D_ _x000D_ //En el primer “ver más” se aprecia que hay una función en el onclick, es esta:_x000D_ _x000D_ function showMore() {_x000D_ document.getElementsByClassName(“texto-oculto”).style.visibility = “visible”;_x000D_ }…(Continue Reading)

¿Cómo se realiza este recorte o forma en css?

publicado por: Anonymous Me gustaria saber como realizar ese diseño de formas y superposicion de la imagen solución Muy fácil, todo depende del comportamiento que quieras lograr con la foto y si necesitas que esté en el html o no. Lo puedes hacer con una estructura como esta: Al banner, solo basta con colocarle la…(Continue Reading)

Cargar CSS según dispositivo con Bootstrap

publicado por: Anonymous Tengo un archivo master.css donde defino estilos generales y dos archivos más llamados movilices.css y screen.css que definen estilos específicos para cada dispositivo, ¿cómo puedo realizar la carga de estos archivos según el dispositivo usado utilizando Bootstrap? Bootstrap trabaja los tamaños de dispositivos con iniciales md, xs, etc., la idea es cargar…(Continue Reading)

Crear tabla dinámica html y JS

publicado por: user101774 estoy haciendo un programa que me genera tablas de forma dinámica , el problema es que no soy capaz de genera la ubicación en la que están, tipo coordenadas. ¿Como lo puedo hacer? He intentado varias cosas pero nada me funciona, por favor help! <html> <head> <script language=”javascript”> function crear(){ var col…(Continue Reading)

Seleccionar un valor por defecto en un elemento HTML cuya opción está deshabilitada

publicado por: Anonymous Mi código es: _x000D_ _x000D_ <select>_x000D_ <option value=”” disabled>seleccione la marca</option>_x000D_ <option value=”saab”>Saab</option>_x000D_ <option value=”vw”>VW</option>_x000D_ <option value=”audi”>Audi</option>_x000D_ </select> _x000D_ _x000D_ _x000D_ ¿Cómo hago para que aparezca en el select seleccione la marca, pero que no se pueda seleccionar? Intenté con disabled pero no aparece. solución Créditos: https://stackoverflow.com/a/22033973/4092887 Prueba con esta código cambiando…(Continue Reading)