Skip to main content
cambiar demo para poder reproducir el problema
Origen Enlace
Alvaro Montoro
  • 49.8k
  • 28
  • 109
  • 190
.info {
  opacity: 0;
  position: absolute;
  left: calc(100% + 1em);
  top: 45%;
  font-size: .8em;
  padding: 0.1em 4em;
  border-radius: 2.2em;
  font-family: arial;
  background: #BFBFBF;
  color: white;
  transition: all ease .3s;
  transform: translateX(-57%) translateY(-50%);
}

.sensor:hover .info {
  opacity: 2;
  transform: translateX(-58%) translateY(-158%);
  z-index: 1000;
}

.img-sensor {
  position: absolute;
  height: 600px;
  width: 800px;
  max-height: 600px;
  max-width: 900px;
}

.sensor {
  position: absolute;
  z-index: 1;
}

#plano {
  position: relative;
  height: 600px;
  width: 800px/9;
  max-width: 800px;
  border: 1px ridge;
  border-color: gainsboro;
  overflow: hidden;
  margin: auto;
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<p>Algo de texto aquí para ver el problema</p>

<div id="contenido-plano">
  <div id="plano">
    <img class="img-sensor" src="http://placehold.it/800x600/eee">
    <div style="top:163px;10px; left:132px;"100px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="1">
      <div class="info">
        Sensor1
        <br>
        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(1)"><i class="glyphicon glyphicon-edit"></i></a>
        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(1)"><i class="glyphicon glyphicon-erase"></i></a>
      </div>
      <img src="http://placehold.it/20/0a0" width="20">
    </div>
    <div style="top:359px; left:252px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="3">
      <div class="info">
        Sensor2
        <br>
        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(3)"><i class="glyphicon glyphicon-edit"></i></a>
        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(3)"><i class="glyphicon glyphicon-erase"></i></a>
      </div>
      <img src="http://placehold.it/20/0a0" width="20">
    </div>
    <div style="top:252px; left:571px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="4">
      <div class="info">
        Sensor3
        <br>
        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(4)"><i class="glyphicon glyphicon-edit"></i></a>
        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(4)"><i class="glyphicon glyphicon-erase"></i></a>
      </div>
      <img src="http://placehold.it/20/0a0" width="20">
    </div>
  </div>
</div>
.info {
  opacity: 0;
  position: absolute;
  left: calc(100% + 1em);
  top: 45%;
  font-size: .8em;
  padding: 0.1em 4em;
  border-radius: 2.2em;
  font-family: arial;
  background: #BFBFBF;
  color: white;
  transition: all ease .3s;
  transform: translateX(-57%) translateY(-50%);
}

.sensor:hover .info {
  opacity: 2;
  transform: translateX(-58%) translateY(-158%);
  z-index: 1000;
}

.img-sensor {
  position: absolute;
  height: 600px;
  width: 800px;
  max-height: 600px;
  max-width: 900px;
}

.sensor {
  position: absolute;
  z-index: 1;
}

#plano {
  position: relative;
  height: 600px;
  width: 800px/9;
  max-width: 800px;
  border: 1px ridge;
  border-color: gainsboro;
  overflow: hidden;
  margin: auto;
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<div id="contenido-plano">
  <div id="plano">
    <img class="img-sensor" src="http://placehold.it/800x600/eee">
    <div style="top:163px; left:132px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="1">
      <div class="info">
        Sensor1
        <br>
        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(1)"><i class="glyphicon glyphicon-edit"></i></a>
        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(1)"><i class="glyphicon glyphicon-erase"></i></a>
      </div>
      <img src="http://placehold.it/20/0a0" width="20">
    </div>
    <div style="top:359px; left:252px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="3">
      <div class="info">
        Sensor2
        <br>
        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(3)"><i class="glyphicon glyphicon-edit"></i></a>
        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(3)"><i class="glyphicon glyphicon-erase"></i></a>
      </div>
      <img src="http://placehold.it/20/0a0" width="20">
    </div>
    <div style="top:252px; left:571px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="4">
      <div class="info">
        Sensor3
        <br>
        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(4)"><i class="glyphicon glyphicon-edit"></i></a>
        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(4)"><i class="glyphicon glyphicon-erase"></i></a>
      </div>
      <img src="http://placehold.it/20/0a0" width="20">
    </div>
  </div>
</div>
.info {
  opacity: 0;
  position: absolute;
  left: calc(100% + 1em);
  top: 45%;
  font-size: .8em;
  padding: 0.1em 4em;
  border-radius: 2.2em;
  font-family: arial;
  background: #BFBFBF;
  color: white;
  transition: all ease .3s;
  transform: translateX(-57%) translateY(-50%);
}

.sensor:hover .info {
  opacity: 2;
  transform: translateX(-58%) translateY(-158%);
  z-index: 1000;
}

.img-sensor {
  position: absolute;
  height: 600px;
  width: 800px;
  max-height: 600px;
  max-width: 900px;
}

.sensor {
  position: absolute;
  z-index: 1;
}

#plano {
  position: relative;
  height: 600px;
  width: 800px/9;
  max-width: 800px;
  border: 1px ridge;
  border-color: gainsboro;
  overflow: hidden;
  margin: auto;
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<p>Algo de texto aquí para ver el problema</p>

<div id="contenido-plano">
  <div id="plano">
    <img class="img-sensor" src="http://placehold.it/800x600/eee">
    <div style="top:10px; left:100px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="1">
      <div class="info">
        Sensor1
        <br>
        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(1)"><i class="glyphicon glyphicon-edit"></i></a>
        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(1)"><i class="glyphicon glyphicon-erase"></i></a>
      </div>
      <img src="http://placehold.it/20/0a0" width="20">
    </div>
    <div style="top:359px; left:252px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="3">
      <div class="info">
        Sensor2
        <br>
        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(3)"><i class="glyphicon glyphicon-edit"></i></a>
        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(3)"><i class="glyphicon glyphicon-erase"></i></a>
      </div>
      <img src="http://placehold.it/20/0a0" width="20">
    </div>
    <div style="top:252px; left:571px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="4">
      <div class="info">
        Sensor3
        <br>
        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(4)"><i class="glyphicon glyphicon-edit"></i></a>
        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(4)"><i class="glyphicon glyphicon-erase"></i></a>
      </div>
      <img src="http://placehold.it/20/0a0" width="20">
    </div>
  </div>
</div>
hacer código ejecutable + formato de texto
Origen Enlace
Alvaro Montoro
  • 49.8k
  • 28
  • 109
  • 190

Div ¿div que se ponga encima del div que lo contiene?

Tengo el siguiente codigocódigo que dinamicamentedinámicamente pone unas imágenes arrastrables en encima de otra imagen. Al poner encima el ratón en el div sensor aparece el info, pero, cuando este estaéste está en una esquina, el div info se cubre por el div que lo contiene`.

HTML Y RAZOR Código:

   <div id="contenido-plano">
        <div id="plano">
            <img class="img-sensor" src="unaimagen.jpgg">
                <div style="top:163px; left:132px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="1">
                    <div class="info">
                        Sensor1
                        <br>
                        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(1)"><i class="glyphicon glyphicon-edit"></i></a>
                        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(1)"><i class="glyphicon glyphicon-erase"></i></a>
                    </div>
                    <img src="/Content/IMG/sensor_verde.png" width="20">
                </div>
                <div style="top:359px; left:252px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="3">
                    <div class="info">
                        Sensor2
                        <br>
                        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(3)"><i class="glyphicon glyphicon-edit"></i></a>
                        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(3)"><i class="glyphicon glyphicon-erase"></i></a>
                    </div>
                    <img src="/Content/IMG/sensor_verde.png" width="20">
                </div>
                <div style="top:252px; left:571px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="4">
                    <div class="info">
                        Sensor3
                        <br>
                        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(4)"><i class="glyphicon glyphicon-edit"></i></a>
                        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(4)"><i class="glyphicon glyphicon-erase"></i></a>
                    </div>
                    <img src="/Content/IMG/sensor_verde.png" width="20">
                </div>
        </div>
    </div>

CSS

.info {
  opacity: 0;
  position: absolute;
  left: calc(100% + 1em);
  top: 45%;
  font-size: .8em;
  padding: 0.1em 4em;
  border-radius: 2.2em;
  font-family: arial;
  background: #BFBFBF;
  color: white;
  transition: all ease .3s;
  transform: translateX(-57%) translateY(-50%);
}

.sensor:hover .info {
  opacity: 2;
  transform: translateX(-58%) translateY(-158%);
  z-index: 1000;
}

.img-sensor {
  position: absolute;
  height: 600px;
  width: 800px;
  max-height: 600px;
  max-width: 900px;
}

.sensor {
  position: absolute;
  z-index: 1;
}

#plano {
  position: relative;
  height: 600px;
  width: 800px/9;
  max-width: 800px;
  border: 1px ridge;
  border-color: gainsboro;
  overflow: hidden;
  margin: auto;
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<div id="contenido-plano">
  <div id="plano">
    <img class="img-sensor" src="http://placehold.it/800x600/eee">
    <div style="top:163px; left:132px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="1">
      <div class="info">
        Sensor1
        <br>
        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(1)"><i class="glyphicon glyphicon-edit"></i></a>
        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(1)"><i class="glyphicon glyphicon-erase"></i></a>
      </div>
      <img src="http://placehold.it/20/0a0" width="20">
    </div>
    <div style="top:359px; left:252px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="3">
      <div class="info">
        Sensor2
        <br>
        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(3)"><i class="glyphicon glyphicon-edit"></i></a>
        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(3)"><i class="glyphicon glyphicon-erase"></i></a>
      </div>
      <img src="http://placehold.it/20/0a0" width="20">
    </div>
    <div style="top:252px; left:571px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="4">
      <div class="info">
        Sensor3
        <br>
        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(4)"><i class="glyphicon glyphicon-edit"></i></a>
        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(4)"><i class="glyphicon glyphicon-erase"></i></a>
      </div>
      <img src="http://placehold.it/20/0a0" width="20">
    </div>
  </div>
</div>
.info {
    opacity: 0;
    position: absolute;
    left: calc(100% + 1em);
    top: 45%;
    font-size: .8em;
    padding: 0.1em 4em;
    border-radius: 2.2em;
    font-family: arial;
    background: #BFBFBF;
    color: white;
    transition: all ease .3s;
    transform: translateX(-57%) translateY(-50%);
}

.sensor:hover .info {
    opacity: 2;
    transform: translateX(-58%) translateY(-158%);
    z-index: 1000;
}

.img-sensor {
    position: absolute;
    height: 600px;
    width: 800px;
    max-height: 600px;
    max-width: 900px;
}

.sensor {
    position: absolute;
    z-index: 1;
}

#plano {
    position: relative;
    height: 600px;
    width: 800px/9;
    max-width: 800px;
    border: 1px ridge;
    border-color: gainsboro;
    overflow: hidden;
    margin:auto;
}
 

Div que se ponga encima del div que lo contiene?

Tengo el siguiente codigo que dinamicamente pone unas imágenes arrastrables en encima de otra imagen. Al poner encima el ratón en el div sensor aparece el info, pero cuando este esta en una esquina el div info se cubre por el div que lo contiene`.

HTML Y RAZOR

   <div id="contenido-plano">
        <div id="plano">
            <img class="img-sensor" src="unaimagen.jpgg">
                <div style="top:163px; left:132px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="1">
                    <div class="info">
                        Sensor1
                        <br>
                        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(1)"><i class="glyphicon glyphicon-edit"></i></a>
                        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(1)"><i class="glyphicon glyphicon-erase"></i></a>
                    </div>
                    <img src="/Content/IMG/sensor_verde.png" width="20">
                </div>
                <div style="top:359px; left:252px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="3">
                    <div class="info">
                        Sensor2
                        <br>
                        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(3)"><i class="glyphicon glyphicon-edit"></i></a>
                        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(3)"><i class="glyphicon glyphicon-erase"></i></a>
                    </div>
                    <img src="/Content/IMG/sensor_verde.png" width="20">
                </div>
                <div style="top:252px; left:571px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="4">
                    <div class="info">
                        Sensor3
                        <br>
                        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(4)"><i class="glyphicon glyphicon-edit"></i></a>
                        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(4)"><i class="glyphicon glyphicon-erase"></i></a>
                    </div>
                    <img src="/Content/IMG/sensor_verde.png" width="20">
                </div>
        </div>
    </div>

CSS

.info {
    opacity: 0;
    position: absolute;
    left: calc(100% + 1em);
    top: 45%;
    font-size: .8em;
    padding: 0.1em 4em;
    border-radius: 2.2em;
    font-family: arial;
    background: #BFBFBF;
    color: white;
    transition: all ease .3s;
    transform: translateX(-57%) translateY(-50%);
}

.sensor:hover .info {
    opacity: 2;
    transform: translateX(-58%) translateY(-158%);
    z-index: 1000;
}

.img-sensor {
    position: absolute;
    height: 600px;
    width: 800px;
    max-height: 600px;
    max-width: 900px;
}

.sensor {
    position: absolute;
    z-index: 1;
}

#plano {
    position: relative;
    height: 600px;
    width: 800px/9;
    max-width: 800px;
    border: 1px ridge;
    border-color: gainsboro;
    overflow: hidden;
    margin:auto;
}

¿div que se ponga encima del div que lo contiene?

Tengo el siguiente código que dinámicamente pone unas imágenes arrastrables en encima de otra imagen. Al poner encima el ratón en el div sensor aparece el info pero, cuando éste está en una esquina, el div info se cubre por el div que lo contiene`.

Código:

.info {
  opacity: 0;
  position: absolute;
  left: calc(100% + 1em);
  top: 45%;
  font-size: .8em;
  padding: 0.1em 4em;
  border-radius: 2.2em;
  font-family: arial;
  background: #BFBFBF;
  color: white;
  transition: all ease .3s;
  transform: translateX(-57%) translateY(-50%);
}

.sensor:hover .info {
  opacity: 2;
  transform: translateX(-58%) translateY(-158%);
  z-index: 1000;
}

.img-sensor {
  position: absolute;
  height: 600px;
  width: 800px;
  max-height: 600px;
  max-width: 900px;
}

.sensor {
  position: absolute;
  z-index: 1;
}

#plano {
  position: relative;
  height: 600px;
  width: 800px/9;
  max-width: 800px;
  border: 1px ridge;
  border-color: gainsboro;
  overflow: hidden;
  margin: auto;
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<div id="contenido-plano">
  <div id="plano">
    <img class="img-sensor" src="http://placehold.it/800x600/eee">
    <div style="top:163px; left:132px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="1">
      <div class="info">
        Sensor1
        <br>
        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(1)"><i class="glyphicon glyphicon-edit"></i></a>
        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(1)"><i class="glyphicon glyphicon-erase"></i></a>
      </div>
      <img src="http://placehold.it/20/0a0" width="20">
    </div>
    <div style="top:359px; left:252px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="3">
      <div class="info">
        Sensor2
        <br>
        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(3)"><i class="glyphicon glyphicon-edit"></i></a>
        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(3)"><i class="glyphicon glyphicon-erase"></i></a>
      </div>
      <img src="http://placehold.it/20/0a0" width="20">
    </div>
    <div style="top:252px; left:571px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="4">
      <div class="info">
        Sensor3
        <br>
        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(4)"><i class="glyphicon glyphicon-edit"></i></a>
        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(4)"><i class="glyphicon glyphicon-erase"></i></a>
      </div>
      <img src="http://placehold.it/20/0a0" width="20">
    </div>
  </div>
</div>
 

se añadieron 1320 caracteres en el cuerpo
Origen Enlace
   <div id="contenido-plano">
        <div id="plano">
            <img class="img-sensor" src="@ViewBag.Planosrc="unaimagen.Imagen"jpgg">
                <div style="top:163px; left:132px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="1">
                    <div class="info">
                        Sensor1
                        <br>
                        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(1)"><i class="glyphicon glyphicon-edit"></>i></a>
        @foreach                <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(var1)"><i Sensorclass="glyphicon inglyphicon-erase"></i></a>
 ViewBag                   </div>
                    <img src="/Content/IMG/sensor_verde.Sensores)png" width="20">
        {        </div>
                <div style="top:@(Sensor.PosY)px;359px; left:@(Sensor.PosX)px;"252px;" class="sensor ui-corner-all ui-state-highlight"highlight ui-draggable ui-draggable-handle" data-id="@Sensor.Id">id="3">
                    <div class="info">
                    @Sensor.Nombre    Sensor2
                    <br />   <br>
                        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(@Sensor.Id3)"   ><i"><i class="glyphicon glyphicon-edit"></i></a>
                        <a title="Eliminar Sensor" id="elimnar-sensor"  onclick="EliminarSensor(@Sensor.Id3)"><i class="glyphicon glyphicon-erase"></i></a>
                    </div>
                    <img src="/Content/IMG/sensor_verde.png" width="20"width="20">
                </>div>
                <div style="top:252px; left:571px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="4">
                    <div class="info">
                        Sensor3
                        <br>
                        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(4)"><i class="glyphicon glyphicon-edit"></i></a>
                        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(4)"><i class="glyphicon glyphicon-erase"></i></a>
                    </div>
                    <img src="/Content/IMG/sensor_verde.png" width="20">
        }        </div>
        </div>
    </div>
<div id="contenido-plano">
    <div id="plano">
        <img class="img-sensor" src="@ViewBag.Plano.Imagen" />
        @foreach (var Sensor in ViewBag.Sensores)
        {
            <div style="top:@(Sensor.PosY)px; left:@(Sensor.PosX)px;" class="sensor ui-corner-all ui-state-highlight" data-id="@Sensor.Id">
                <div class="info">
                    @Sensor.Nombre
                    <br />
                    <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(@Sensor.Id)"   ><i class="glyphicon glyphicon-edit"></i></a>
                    <a title="Eliminar Sensor" id="elimnar-sensor"  onclick="EliminarSensor(@Sensor.Id)"><i class="glyphicon glyphicon-erase"></i></a>
                </div>
                <img src="/Content/IMG/sensor_verde.png" width="20" />
            </div>

        }
    </div>
</div>
   <div id="contenido-plano">
        <div id="plano">
            <img class="img-sensor" src="unaimagen.jpgg">
                <div style="top:163px; left:132px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="1">
                    <div class="info">
                        Sensor1
                        <br>
                        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(1)"><i class="glyphicon glyphicon-edit"></i></a>
                        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(1)"><i class="glyphicon glyphicon-erase"></i></a>
                    </div>
                    <img src="/Content/IMG/sensor_verde.png" width="20">
                </div>
                <div style="top:359px; left:252px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="3">
                    <div class="info">
                        Sensor2
                        <br>
                        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(3)"><i class="glyphicon glyphicon-edit"></i></a>
                        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(3)"><i class="glyphicon glyphicon-erase"></i></a>
                    </div>
                    <img src="/Content/IMG/sensor_verde.png" width="20">
                </div>
                <div style="top:252px; left:571px;" class="sensor ui-corner-all ui-state-highlight ui-draggable ui-draggable-handle" data-id="4">
                    <div class="info">
                        Sensor3
                        <br>
                        <a title="Editar Sensor" id="editar-sensor" onclick="EditarSensor(4)"><i class="glyphicon glyphicon-edit"></i></a>
                        <a title="Eliminar Sensor" id="elimnar-sensor" onclick="EliminarSensor(4)"><i class="glyphicon glyphicon-erase"></i></a>
                    </div>
                    <img src="/Content/IMG/sensor_verde.png" width="20">
                </div>
        </div>
    </div>
Origen Enlace
Loading