Исчезание одного деления в другое - PullRequest
Новая
       7

Исчезание одного деления в другое

0 голосов
/ 17 мая 2011

У меня возникли небольшие проблемы с переходом одного элемента в другой, вот мой код (и тестовая страница ):

HTML: 

<div id="grid">
    <div class="grid-box">
        <div class="phase-1">
           <img class="grid-image" src="http://teamworksdesign.com/v2/wp-content/themes/default/images/dtr.jpg" alt="" height="152" width="210" />
           <div class="grid-heading">
                <h2>DTR Medical</h2>
                <h3>Branding, Web, Print</h3>
            </div> 
        </div>
        <div class="phase-2">
            <div class="grid-info">
                <h4>Probeything 2000</h4>
                <p>Marketing unglamorous single-use medical intruments is not simple. We helped Neurosign increasetheir sales by 25% and increasemarket awareness.</p>
            </div>
            <div class="grid-heading-hover">
                <h2>DTR Medical</h2>
                <h3>Branding, Web, Print</h3>
            </div> 
        </div>
    </div>
</div>

Javascript: 

<script type="text/javascript"> 

$(document).ready(function(){
            $(".phase-2").hide();
        });


$(function(){
$('.grid-box').hover(
        function(){
            $('.grid-box .phase-1').fadeOut(200, function(){
                $('.grid-box .phase-2').fadeIn(200);                         
            });
        },
        function(){
            $('.grid-box .phase-2').fadeOut(200, function(){
                $('.grid-box .phase-1').fadeIn(200);                         
            });
        }
        ); 
});
</script>

CSS: 

.phase-1 .grid-image {
    width:210px;
    height:220px;
    overflow:hidden;    
    }

.phase-2 {
    position:relative;
    top:-220px;
    }

ОБНОВЛЕНИЕ: у меня есть один «рабочий» (см. Тестовую ссылку в вопросе).Можно ли остановить его замирание до белого, а затем замирание на следующем этапе?Я хочу сначала сделать два деления друг на друга, а не на белый.

1 Ответ

1 голос
/ 17 мая 2011

Если вы наберете $ на консоли, он ответит undefined, поэтому он, вероятно, был переопределен каким-то другим сценарием. Чтобы снова использовать $, что означает jQuery, используйте следующий синтаксис 

$(document).ready(function($) {
    // $ means jQuery again in here
});

Обратите внимание на $ в качестве первого аргумента вызова функции.

Документация здесь .

...