0
konnte nicht ausgeführt werden 'removeChild'
var first_content = document.getElementById('first-content'),
\t offered_games = document.getElementById('offered-games');
for(var i = 0, e = offered_games.children; i < e.length; i++) {
e[i].onmouseenter = function() {
// img_player.style.backgroundImage = 'url(' + this.children[0].children[0].src + ')';
var img = document.createElement('img');
img.src = this.children[0].children[0].src;
img.classList.add('added-promotion');
first_content.appendChild(img);
setTimeout(function() {
img.style.opacity = 1;
}, 10)
}
function removeImg(img) {
setTimeout(function() {
first_content.removeChild(img)
}, 300) \t
}
e[i].onmouseleave = function() {
var added_promo = document.querySelectorAll('.added-promotion') || document.querySelector('.added-promotion');
for(var i = 0, e = added_promo; i < e.length; i++) {
e[i].style.opacity = 0;
removeImg(e[i])
}
}
}.first-content .img#img-player {
height: 100%;
width: 100%;
background-image: url('');
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
.first-content #offered-games {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 980px;
position: absolute;
z-index: 8;
bottom: 180px;
left: 50%;
margin-left: -490px;
}
.first-content #offered-games .game {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 235px;
margin-left: 9.3px;
vertical-align: bottom;
display: inline-block;
cursor: pointer;
}
.first-content #offered-games .game:hover .top {
height: 100px;
}
.first-content #offered-games .game:hover .top img {
-webkit-transform: translateY(-30px) scale(1.2);
-moz-transform: translateY(-30px) scale(1.2);
-ms-transform: translateY(-30px) scale(1.2);
-o-transform: translateY(-30px) scale(1.2);
transform: translateY(-30px) scale(1.2);
}
.first-content #offered-games .game:hover .bottom .text {
max-height: 235px;
}
.first-content #offered-games .game:hover .bottom .text p.content {
opacity: 1;
}
.first-content #offered-games .game:first-child {
margin-left: 0;
}
.first-content #offered-games .game.sportsbook .top {
border-top: 4px solid #ff0039;
}
.first-content #offered-games .game.sportsbook .bottom p.title {
color: #ff0039;
}
.first-content #offered-games .game.sportsbook .bottom button {
background: #ff0039;
}
.first-content #offered-games .game.poker .top {
border-top: 4px solid #0c82b1;
}
.first-content #offered-games .game.poker .bottom p.title {
color: #0c82b1;
}
.first-content #offered-games .game.poker .bottom button {
background: #0c82b1;
}
.first-content #offered-games .game.casino .top {
border-top: 4px solid #efb717;
}
.first-content #offered-games .game.casino .bottom p.title {
color: #efb717;
}
.first-content #offered-games .game.casino .bottom button {
background: #efb717;
}
.first-content #offered-games .game.bolatangkas .top {
border-top: 4px solid #0db561;
}
.first-content #offered-games .game.bolatangkas .bottom p.title {
color: #0db561;
}
.first-content #offered-games .game.bolatangkas .bottom button {
background: #0db561;
}
.first-content #offered-games .game .top {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
height: 130px;
background: black;
overflow: hidden;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.first-content #offered-games .game .top img {
width: 100%;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.first-content #offered-games .game .bottom {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
display: table;
background: white;
padding: 20px;
position: relative;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.3);
}
.first-content #offered-games .game .bottom .text {
max-height: 15px;
overflow: hidden;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.first-content #offered-games .game .bottom .text.active {
max-height: 120px;
padding-bottom: 30px;
}
.first-content #offered-games .game .bottom .text p.title {
font-size: 18px;
font-weight: 700;
letter-spacing: 1px;
text-transform: uppercase;
margin-bottom: 5px;
}
.first-content #offered-games .game .bottom .text p.content {
margin: 8px 0 5px;
color: #6b6b6b;
font-size: 13px;
font-weight: 300;
line-height: 17px;
text-align: justify;
opacity: 0;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.first-content #offered-games .game .bottom button.btn-view {
position: absolute;
top: 14px;
right: 20px;
border: none;
border-radius: 30px;
padding: 7px 15px;
text-transform: uppercase;
font-size: 12px;
font-weight: 700;
letter-spacing: 1px;
color: white;
}<div id="first-content" class="first-content">
<div id="img-player" class="img"></div>
<div id="offered-games">
<div data-info="sportsbook" class="game sportsbook">
<div class="top"><img src="http://0.tqn.com/d/worldsoccer/1/L/u/M/-/-/451274454.jpg"></div>
<div class="bottom">
<div class="text">
<p class="title">Game 1</p>
<p class="content">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.</p>
</div>
</div>
</div>
<div data-info="poker" class="game poker">
<div class="top"><img src="http://cache4.asset-cache.net/gc/492689397-soccer-player-standing-on-pitch-gettyimages.jpg?v=1&c=IWSAsset&k=2&d=%2F7DaYEj3tOfsAmZVQjUjN%2Fp85xL5t%2FRvXvNDXWwcD%2BWLs1oLsXFGW8D%2BBw37QVMl96M1ZTHpoFW9f6CnK92rTg%3D%3D"></div>
<div class="bottom">
<div class="text">
<p class="title">Game 2</p>
<p class="content">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.</p>
</div>
</div>
</div>
</div>
</div>Fehler: Uncaught DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.
Wenn Sie schweben extrem schnell ich diesen Fehler. Aber wenn schweben langsam. Es läuft gut.
Warum bekomme ich diesen Fehler immer wieder? Eigentlich funktioniert es, aber ich denke, es kann die Vorlage beeinflussen, die ich vorschlage.
Jede Hilfe wäre willkommen. Dank
warf einen Blick auf diese, sah ein Wand des Codes und wandte sich ab. Erwägen Sie die Bearbeitung, um mehr von einem [_Minimal_, Complete und Verifable Example] (http://stackoverflow.com/help/mcve) zur Verfügung zu stellen. – qxz
@qxz Eigentlich ist es minimiert, da ich Code-Snippet lief, das läuft. Ich habe alles unnötigen Code entfernt. Vielleicht mache ich nur zwei Auswahlen. Danke –
Der Fehler scheint ziemlich klar zu sein, Sie versuchen, ein Element von einem anderen Element zu entfernen, das nicht die direkten Elemente der ersten Elemente ist. Konsole protokolliere die Elemente und finde heraus, welche Elemente du hast. – adeneo