Aplicar estilo css a botones por separado Aplicar estilo css a botones por separado
Aplicar estilo css a botones por separado
Mostrando resultados del 1 al 1 de 1
  1. #1
    Aplicar estilo css a botones por separado
    Hola betas, estoy intentando darle estilo css por separado a los botones, es decir un estilo css distinto para cada botón. para poder usar el :before y poner un icono a cada botón.

    Tengo este código que funciona perfectamente pero tienen todos asignado el mismo estilo.

    JS
    Código HTML:
    function reemplazarSeleccion(control, texto){ // v2011-12-21
    	var inicio, seleccion;
    
    	if("selectionStart" in control){ // W3C
    		// Guardamos la posición inicial del cursor
    		inicio = control.selectionStart;
    
    		// Reemplazamos todo el contenido
    		control.value = control.value.substr(0, control.selectionStart) +
    			texto +	control.value.substr(control.selectionEnd, control.value.length);
    
    		// Movemos el cursor a la posición final
    		control.selectionStart = inicio + texto.length;
    		control.selectionEnd = inicio + texto.length;
    		
    		control.focus();
    
    	}else if(document.selection){ // IE
    		control.focus();
    
    		// Obtenemos la selección y la reemplazamos por el nuevo texto
    		seleccion = document.selection.createRange();
    		seleccion.text = texto;
    
    		seleccion.select();
    
    	}else{
    		// No sabemos dónde está el cursor: insertamos el texto al final
    		control.value += texto;
    	}
    }
    jQuery(function($){
    	var botones = {
    		"Titulo": function(){
    			return "[titulo][/titulo]";
    		},
    		"Negrita": function(){
    			return "[B][/B]";
    		},
    		"centrar": function(){
    			return "[C][/C]";
    		},
    		"enlace": function(){
    			return "[enlace link=' '  blank='true'][/enlace]";
    		}, 
    		"imagen": function(){
    			return "[quote]Invitados no pueden ver imágenes en los mensajes. Por favor regístrate en el foro.[/quote]";
    		},
    		"youtube": function(){
    			return "[youtube][/youtube]";
    		},
    		"citar": function(){
    			return "[citar][/citar]";
    		},
    		"i": function(){
    			return "[i][/i]";
    		},
    		"lista": function(){
    			return "[lista][/lista]";
    		},
    		"subir": function(){
    			popUp('/subir_imagen.php');
    			
    			return "";
    		},
    		"spoiler": function(){
    			return "[spoilers title=' '][/spoilers]";
    		}
    		
    	};
    	$(".ps-postbox-status textarea").each(function(){
    		var $cajaBotones = $("<div><\/div>");
    		$cajaBotones.insertBefore($(this));
    
    		for(etiqueta in botones){
    			var $boton = $('<input type="button" class="stream_boton" style="padding: 5px; margin-top: -8px; margin-bottom: 20px;">');
    			$boton.data("control", this).data("callbackTexto", botones[etiqueta]).val(etiqueta).click(function(){
    				var control = $(this).data("control");
    				var texto = $(this).data("callbackTexto")();
    				reemplazarSeleccion(control, texto);
    			});
    			$boton.insertBefore($cajaBotones);
    		}
    	});
    });
    gracias y saludos
    Última edición por gallurt; 20-mar-2017 a las 14:11 Razón: corregir titulo

Temas similares

  1. Tutorial: Botones para descargar con estilo.
    Hola este tutorial surgió por la duda del usuario javierbt de como poner un diseño de botones para descargar de diferentes servidores. A continuación...
    Respuestas: 18
    Último mensaje: 07-sep-2016
  2. Botones para compartir al estilo sharethis.com
    Amigos, en mi sitio tengo botones para compartir de sharethis.com iba todo muy bien hasta que me di cuenta que al compartir aveces tiene problemas...
    Respuestas: 2
    Último mensaje: 09-ene-2014
  3. problemas con botones de nuevo estilo
    he intentado cambiarlos por ya los traducidos pero no lo consigo,uso uno llamado ambiance y continuan en ingles, es mas,accedo por FTP y siguen...
    Respuestas: 2
    Último mensaje: 03-dic-2005

Normas de publicación

  • No puedes crear nuevos temas
  • No puedes responder mensajes
  • No puedes subir archivos adjuntos
  • No puedes editar tus mensajes
  •