• 24-09-2010, 17:22:02
    #1
    menu içinde herhangi bir div class'ın üstüne geldiğinde arkaplanın resmini değiştirmeye çalışıyorum ancak yapamadım bir türlü.

    Resmin önce normal pozisyonunu gösteriyorum üstüne geldiğindede menu-li divinin arkaplanının değişmesini sağlamaya çalışıyorum ama yapamadım.

    Css Bu şekilde
    #menu
    {
        float: left;
        width: 874px;
        height: 50px;
        background-image: url('../images/deneme.png');
        background-position: 0px 0px;
        background-repeat: repeat-x;
    }
    .menu-li
    {
        float: left;
        width: auto;    
        font-weight: bold;
        font-size: 16px;
        margin-right: 10px;   
    }
    .menu-li:Hover
    {           
        background-image: url('../images/deneme.png');
        background-position: 0px -50px;
    }
    üstüne geldiğinde arkaplanı değişecek divler bu şekilde
    <div id="menu">    
            <div class="menu-li">Menu 1</div> 
            <div class="menu-li">Menu 2</div> 
            <div class="menu-li">Menu 3</div> 
            <div class="menu-li">Menu 4</div>
    </div>

    Şimdi jquery ilede şöyle denedim menu-li:Hover'ı kaldırarak ama yine olmadı
    $("div.menu-li").css({backgroundPosition: '0px -50px'});

    Nasıl olabilir ?
  • 24-09-2010, 20:06:44
    #2
    hover olayı sadece linkler için geçerli diye biliyorum. yapmak istediğini javascript ile yapabilirsin.
  • 24-09-2010, 20:55:05
    #3
    şunu denermisin
    #menu
    {
        float: left;
        width: 874px;
        height: 50px;
        background:url(../images/deneme.png) repeat-x 0 0;
    }
    .menu-li
    {
        float: left;
        width: auto;    
        font-weight: bold;
        font-size: 16px;
        margin-right: 10px;   
    }
    .menu-li:hover
    {           
        background:url(../images/deneme.png) no-repeat 0 -50px;
    }
  • 27-09-2010, 16:05:34
    #4
    <div class="menu-li" onmouseover="this.style.background-image='../images/deneme.png'" onmouseout="this.style.background-image='none'">Menu 1</div>