Weird checkered css transition

Question

Я разрабатываю свою собственную галерею изображений, и у меня возникают некоторые странные проблемы, когда изображение обновляется в контейнере div.

Что нужно сделать, когда человек нажимает на одну из кнопок изображения, чтобы увидеть ее увеличенную, она исчезает до этого изображения, как видно на миниатюре. У них возникает проблема с тем, что он исчезает, и в то же время он похож на клетчатый переход.

Take a look

Что я пытался делать устанавливает ребенку li «S и div» s background-size к background-size: 600px 450px; и background-size: 100% 100%, но ни один до сих пор делает странный переход.

Единственный раз, когда он не выполняет переход с шасси, когда background-size не установлен ни на один из элементов.

Заранее благодарен!

Answer 1

использование background-repeat:no-repeat; на li:nth-child(1) & li:nth-child(2), потому что вы использовали изображение в качестве фона, так что повторяться, а затем перешел на 100%,

li:nth-child(1){ 
    background: url("http://i.imgur.com/dT06PEZ.jpg"); 
    background-size: 100% 100%; 
    background-repeat:no-repeat; 
} 
li:nth-child(2){ 
    background: url("http://i.imgur.com/whcDsFy.jpg"); 
    background-size: 100% 100%; 
    background-repeat:no-repeat; 
}