Cómo reemplazar el texto flotante con una imagen en lugar de una cuadrícula hexagonal

lolveley Publicado en Dev

JoeyGambino

Estoy creando esta cuadrícula hexadecimal codificada para mostrar una cartera. Todo está funcionando bien, pero estoy luchando por encontrar una solución para cambiar el texto al pasar el mouse por una imagen. El código que he usado es de otro usuario que pensé que sería una gran idea para mi sitio, sin embargo, mi conocimiento sobre JS es bastante limitado, he modificado algunas líneas de código para obtener el aspecto / estilo de identificación del original, sin embargo, me resulta difícil reemplazar el texto con una imagen (logotipo).

Intenté poner una etiqueta img dentro de pero parece que todo está configurado a través de JS.

Codepen: https://codepen.io/gambino85/pen/voZvNp

Me gustaría que el hexágono muestre un logotipo (imagen) al pasar el mouse, pero la salida real es texto.

(function($) {
  $.fn.honeycombs = function(options) {
    // Establish our default settings
    var settings = $.extend(
      {
        combWidth: 250,
        margin: 10
      },
      options
    );

    function initialise(element) {
      $(element).addClass("honeycombs-wrapper");

      var width = 0;
      var combWidth = 0;
      var combHeight = 0;
      var num = 0;
      var $wrapper = null;

      /**
       * Build the dom
       */
      function buildHtml() {
        // add the 2 other boxes
        $(element)
          .find(".comb")
          .wrapAll('<div class="honeycombs-inner-wrapper"></div>');
        $wrapper = $(element).find(".honeycombs-inner-wrapper");

        $(element)
          .find(".comb")
          .append('<div class="hex_l"></div>');
        $(element)
          .find(".hex_l")
          .append('<div class="hex_r"></div>');
        $(element)
          .find(".hex_r")
          .append('<div class="hex_inner"></div>');

        $(element)
          .find(".hex_inner")
          .append(
            '<div class="inner_span"><div class="inner-text"></div></div>'
          );

        num = 0;

        $(element)
          .find(".comb")
          .each(function() {
            num = num + 1;
            var image = $(this)
              .find("img")
              .attr("src");
            var css = 'url("' + image + '") ';

            $(this)
              .find(".hex_inner")
              .attr("style", "background-image: " + css);

            if ($(this).find("span").length > 0) {
              $(this)
                .find(".inner_span .inner-text")
                .html(
                  $(this)
                    .find("span")
                    .html()
                );
            } else {
              $(this)
                .find(".inner_span")
                .remove();
            }
          });

        $(element)
          .find("img, span, .inner_span")
          .hide();
      }

      /**
       * Update all scale values
       */
      function updateScales() {
        combWidth = settings.combWidth;
        combHeight = Math.sqrt(3) * combWidth / 2;
        edgeWidth = combWidth / 2;

        $(element)
          .find(".comb")
          .width(combWidth)
          .height(combHeight);
        $(element)
          .find(".hex_l, .hex_r")
          .width(combWidth)
          .height(combHeight);
        $(element)
          .find(".hex_inner")
          .width(combWidth)
          .height(combHeight);
      }

      /**
       * update css classes
       */
      function reorder(animate) {
        updateScales();
        width = $(element).width();

        newWidth = num / 1.5 * settings.combWidth;

        if (newWidth < width) {
          width = newWidth;
        }

        $wrapper.width(width);

        var row = 0; // current row
        var upDown = 1; // 1 is down
        var left = 0; // pos left
        var top = 0; // pos top

        var cols = 0;

        $(element)
          .find(".comb")
          .each(function(index) {
            top =
              row * (combHeight + settings.margin) +
              upDown * (combHeight / 2 + settings.margin / 2);

            if (animate == true) {
              $(this).stop(true, false);
              $(this).animate({ left: left, top: top });
            } else {
              $(this)
                .css("left", left)
                .css("top", top);
            }

            left = left + (combWidth - combWidth / 4 + settings.margin);
            upDown = (upDown + 1) % 2;

            if (row == 0) {
              cols = cols + 1;
            }

            if (left + combWidth > width) {
              left = 0;
              row = row + 1;
              upDown = 1;
            }
          });

        $wrapper
          .width(cols * (combWidth / 4 * 3 + settings.margin) + combWidth / 4)
          .height((row + 1) * (combHeight + settings.margin) + combHeight / 2);
      }

      $(window).resize(function() {
        reorder(true);
      });

      $(element)
        .find(".comb")
        .mouseenter(function() {
          $(this)
            .find(".inner_span")
            .stop(true, true);
          $(this)
            .find(".inner_span")
            .fadeIn();
        });

      $(element)
        .find(".comb")
        .mouseleave(function() {
          $(this)
            .find(".inner_span")
            .stop(true, true);
          $(this)
            .find(".inner_span")
            .fadeOut();
        });

      buildHtml();
      reorder(false);
    }

    return this.each(function() {
      initialise(this);
    });
  };
})(jQuery);

/*Codepen display adjustments*/
.container {
  width: 90%;
  margin: 0 auto;
}
.wrap {
  margin: 150px 0px;
}

/*Honeycomb CSS*/
.honeycombs {
  position: relative;
  overflow: hidden;
  width: 100%;
  text-align: center;
}

.honeycombs .inner_span {
  display: inline-block;
  height: 100%;
  width: 100%;
  background-color: rgba(12, 12, 12, 0.65);
  font-family: sans-serif;
  color: #000;
}
.honeycombs .inner-text {
  padding-top: 40%;
  padding-left: 10px;
  padding-right: 10px;
  color: white;
}



.honeycombs .honeycombs-inner-wrapper {
  display: inline-block;
  overflow: hidden;
  width: 700px;
  position: relative;
  height: 1200px;
}

.honeycombs .comb {
  position: absolute;
  display: inline-block;
}

.honeycombs .hex_l,
.honeycombs .hex_r {
  overflow: hidden;
  position: absolute;
  /* -webkit-backface-visibility: hidden; */
}

.honeycombs .hex_l {
  visibility: hidden;
  -moz-transform: rotate(60deg);
  -ms-transform: rotate(60deg);
  -o-transform: rotate(60deg);
  -webkit-transform: rotate(60deg);

  transform: rotate(60deg);
}

.honeycombs .hex_r {
  visibility: hidden;
  -moz-transform: rotate(-120deg);
  -ms-transform: rotate(-120deg);
  -o-transform: rotate(-120deg);
  -webkit-transform: rotate(-120deg);

  transform: rotate(-120deg);
}

.honeycombs .hex_inner {
  display: block;
  visibility: visible;
  -moz-transform: rotate(60deg);
  -ms-transform: rotate(60deg);
  -o-transform: rotate(60deg);
  -webkit-transform: rotate(60deg);

  transform: rotate(60deg);

  background-position: center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

  cursor: pointer;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
  <div class="wrap">
    <div class="honeycombs">
      <div class="comb">
        <img src="https://images.unsplash.com/photo-1528920304568-7aa06b3dda8b?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2251&q=80" /><span> Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1501785888041-af3ef285b470?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2250&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1511884642898-4c92249e20b6?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2250&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1527503499129-151b4843eff5?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=934&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1469286714608-0defd688c4e3?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=956&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1513581166391-887a96ddeafd?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2250&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1454486837617-ce8e1ba5ebfe?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2252&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1495954484750-af469f2f9be5?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=3300&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1479936343636-73cdc5aae0c3?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1400&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1474433188271-d3f339f41911?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2250&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1506953823976-52e1fdc0149a?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=975&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1538964173425-93884d739596?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=975&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1444703686981-a3abbc4d4fe3?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=3300&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1483728642387-6c3bdd6c93e5?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2255&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1496851002542-2fe43ae0ef15?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2267&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1473951298521-f0f27c6bda7b?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2250&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=934&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1564067123764-f1181aea101f?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2651&q=80" /> <span>Lorem Ipsum</span>
      </div>
    </div>
  </div>
</div>
<script type="text/javascript">
  $(document).ready(function() {
    $('.honeycombs').honeycombs({
      combWidth: 200,
      margin: 10
    });
  });
</script>

Usuario genérico

Aquí hay algo que inserta una imagen en lugar de texto. Obviamente, querrá adaptarse a su logotipo y estilo específicos.

(function($) {
  $.fn.honeycombs = function(options) {
    // Establish our default settings
    var settings = $.extend(
      {
        combWidth: 250,
        margin: 10
      },
      options
    );

    function initialise(element) {
      $(element).addClass("honeycombs-wrapper");

      var width = 0;
      var combWidth = 0;
      var combHeight = 0;
      var num = 0;
      var $wrapper = null;

      /**
       * Build the dom
       */
      function buildHtml() {
        // add the 2 other boxes
        $(element)
          .find(".comb")
          .wrapAll('<div class="honeycombs-inner-wrapper"></div>');
        $wrapper = $(element).find(".honeycombs-inner-wrapper");

        $(element)
          .find(".comb")
          .append('<div class="hex_l"></div>');
        $(element)
          .find(".hex_l")
          .append('<div class="hex_r"></div>');
        $(element)
          .find(".hex_r")
          .append('<div class="hex_inner"></div>');

        $(element)
          .find(".hex_inner")
          .append(
            '<div class="inner_span"><div class="inner-text"></div></div>'
          );

        num = 0;

        $(element)
          .find(".comb")
          .each(function() {
            num = num + 1;
            var image = $(this)
              .find("img")
              .attr("src");
            var css = 'url("' + image + '") ';

            $(this)
              .find(".hex_inner")
              .attr("style", "background-image: " + css);

            if ($(this).find("span").length > 0) {
              $(this)
                .find(".inner_span .inner-text")
                .html('<img src="https://vuejs.org/images/logo.png" style="width:50px;height:50px;display:block !important" />');
            } else {
              $(this)
                .find(".inner_span")
                .remove();
            }
          });

        $(element)
          .find("img, span, .inner_span")
          .hide();
      }

      /**
       * Update all scale values
       */
      function updateScales() {
        combWidth = settings.combWidth;
        combHeight = Math.sqrt(3) * combWidth / 2;
        edgeWidth = combWidth / 2;

        $(element)
          .find(".comb")
          .width(combWidth)
          .height(combHeight);
        $(element)
          .find(".hex_l, .hex_r")
          .width(combWidth)
          .height(combHeight);
        $(element)
          .find(".hex_inner")
          .width(combWidth)
          .height(combHeight);
      }

      /**
       * update css classes
       */
      function reorder(animate) {
        updateScales();
        width = $(element).width();

        newWidth = num / 1.5 * settings.combWidth;

        if (newWidth < width) {
          width = newWidth;
        }

        $wrapper.width(width);

        var row = 0; // current row
        var upDown = 1; // 1 is down
        var left = 0; // pos left
        var top = 0; // pos top

        var cols = 0;

        $(element)
          .find(".comb")
          .each(function(index) {
            top =
              row * (combHeight + settings.margin) +
              upDown * (combHeight / 2 + settings.margin / 2);

            if (animate == true) {
              $(this).stop(true, false);
              $(this).animate({ left: left, top: top });
            } else {
              $(this)
                .css("left", left)
                .css("top", top);
            }

            left = left + (combWidth - combWidth / 4 + settings.margin);
            upDown = (upDown + 1) % 2;

            if (row == 0) {
              cols = cols + 1;
            }

            if (left + combWidth > width) {
              left = 0;
              row = row + 1;
              upDown = 1;
            }
          });

        $wrapper
          .width(cols * (combWidth / 4 * 3 + settings.margin) + combWidth / 4)
          .height((row + 1) * (combHeight + settings.margin) + combHeight / 2);
      }

      $(window).resize(function() {
        reorder(true);
      });

      $(element)
        .find(".comb")
        .mouseenter(function() {
          $(this)
            .find(".inner_span")
            .stop(true, true);
          $(this)
            .find(".inner_span")
            .fadeIn();
        });

      $(element)
        .find(".comb")
        .mouseleave(function() {
          $(this)
            .find(".inner_span")
            .stop(true, true);
          $(this)
            .find(".inner_span")
            .fadeOut();
        });

      buildHtml();
      reorder(false);
    }

    return this.each(function() {
      initialise(this);
    });
  };
})(jQuery);

/*Codepen display adjustments*/
.container {
  width: 90%;
  margin: 0 auto;
}
.wrap {
  margin: 150px 0px;
}

/*Honeycomb CSS*/
.honeycombs {
  position: relative;
  overflow: hidden;
  width: 100%;
  text-align: center;
}

.honeycombs .inner_span {
  display: inline-block;
  height: 100%;
  width: 100%;
  background-color: rgba(12, 12, 12, 0.65);
  font-family: sans-serif;
  color: #000;
}
.honeycombs .inner-text {
  padding-top: 40%;
  padding-left: 10px;
  padding-right: 10px;
  color: white;
}

.inner-text img {
  display: block !important;
}


.honeycombs .honeycombs-inner-wrapper {
  display: inline-block;
  overflow: hidden;
  width: 700px;
  position: relative;
  height: 1200px;
}

.honeycombs .comb {
  position: absolute;
  display: inline-block;
}

.honeycombs .hex_l,
.honeycombs .hex_r {
  overflow: hidden;
  position: absolute;
  /* -webkit-backface-visibility: hidden; */
}

.honeycombs .hex_l {
  visibility: hidden;
  -moz-transform: rotate(60deg);
  -ms-transform: rotate(60deg);
  -o-transform: rotate(60deg);
  -webkit-transform: rotate(60deg);

  transform: rotate(60deg);
}

.honeycombs .hex_r {
  visibility: hidden;
  -moz-transform: rotate(-120deg);
  -ms-transform: rotate(-120deg);
  -o-transform: rotate(-120deg);
  -webkit-transform: rotate(-120deg);

  transform: rotate(-120deg);
}

.honeycombs .hex_inner {
  display: block;
  visibility: visible;
  -moz-transform: rotate(60deg);
  -ms-transform: rotate(60deg);
  -o-transform: rotate(60deg);
  -webkit-transform: rotate(60deg);

  transform: rotate(60deg);

  background-position: center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

  cursor: pointer;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
  <div class="wrap">
    <div class="honeycombs">
      <div class="comb">
        <img src="https://images.unsplash.com/photo-1528920304568-7aa06b3dda8b?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2251&q=80" /><span> Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1501785888041-af3ef285b470?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2250&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1511884642898-4c92249e20b6?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2250&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1527503499129-151b4843eff5?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=934&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1469286714608-0defd688c4e3?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=956&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1513581166391-887a96ddeafd?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2250&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1454486837617-ce8e1ba5ebfe?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2252&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1495954484750-af469f2f9be5?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=3300&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1479936343636-73cdc5aae0c3?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1400&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1474433188271-d3f339f41911?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2250&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1506953823976-52e1fdc0149a?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=975&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1538964173425-93884d739596?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=975&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1444703686981-a3abbc4d4fe3?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=3300&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1483728642387-6c3bdd6c93e5?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2255&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1496851002542-2fe43ae0ef15?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2267&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1473951298521-f0f27c6bda7b?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2250&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=934&q=80" /> <span>Lorem Ipsum</span>
      </div>
      <div class="comb"><img src="https://images.unsplash.com/photo-1564067123764-f1181aea101f?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2651&q=80" /> <span>Lorem Ipsum</span>
      </div>
    </div>
  </div>
</div>
<script type="text/javascript">
  $(document).ready(function() {
    $('.honeycombs').honeycombs({
      combWidth: 200,
      margin: 10
    });
  });
</script>

Este artículo se recopila de Internet, indique la fuente cuando se vuelva a imprimir.

En caso de infracción, por favor [email protected] Eliminar

Editado en2021-01-20

Déjame decir algunas palabras

0Comentarios

Iniciar sesiónRevisión de participación posterior

Anterior:¿Existe una función / flujo de trabajo en R o Python para trazar caracteres por posición para las comparaciones de palabras?

TOP Lista

Artículos

Cómo reemplazar el texto flotante con una imagen en lugar de una cuadrícula hexagonal

Cómo reemplazar el texto flotante con una imagen en lugar de una cuadrícula hexagonal

¿Cómo ocultar la aplicación web de los robots de búsqueda? (ASP.NET)

Limitar las entradas de One2many Lines en odoo

Ver todos los comentarios en un video de YouTube

Declaración if simple en intérprete de python

¿La mejor manera de construir la GUI de Java Swing?

Cómo conectar Flutter con MongoDB

Leer Azure Key Vault Secret de la aplicación Function

Importar archivo js con TypeScript 2.0

BeautifulSoup: extraer texto de la etiqueta de anclaje

Cerrar el menú de material angular desde el controlador

Error de menú desplegable en Bootstrap 4

La mejor manera de iterar SortedSet / SortedMap en Java al revés

¿Precedencia de operadores?

Google 스프레드 시트 : QUERY를 사용하여 그룹 내 상위 N 개 케이스 선택

Intentando reproducir mp3 usando Vue.js

Extraction du nœud enfant de la réponse JSON à l'aide du script SoapUI-Groovy

Comparer des images dans Pygame (pas pixel par pixel)

Estructura de la carpeta del proyecto Spring Boot para el cliente de descanso

Validación de formulario Angular 4

La mejor manera de leer archivos binarios estructurados con Java

cómo usar% dopar% cuando solo se importa foreach en la DESCRIPCIÓN de un paquete