One of my images is not affected by opacity in CSS

One of the two arrows I have, and I'm not pointing fingers (its id="darrow") does not see to be affected by my opacity: 0.7; property in my CSS. Can anyone see what's wrong? It worked fine before I added the second arrow and the animation. The other arrow seems to work flawlessly however.

HTML:

<img src="images/stills/uarrow.png" id="uarrow">
<img src="images/stills/darrow.png" id="darrow"> <!--Problem arrow-->
<div id="footer">
<p id="fpara">Site/logo design by Zachary Ledyard.</p>
</div>

CSS:

#darrow
{
    bottom: 20px;
}

#uarrow
{
    bottom: -40px;
}

#darrow, #uarrow
{
    position: fixed;
    left: 50%;
    margin-left: -9px;
    padding: 0;
    width: 18px;
    height: 14px;
    opacity: 0.7;
    z-index: 11;
}

#darrow, #uarrow:hover
{
    opacity: 1.0;
}
#footer
{
    padding: 0;
    width: 100%;
    height: 70px;
    position: fixed;
    bottom: 0;
    border-top: 1px solid #000000;
    z-index: 6;
    background-color: rgba(255, 128, 0, 0.7)
}

JQuery;

$(document).ready(function(){
  $("#darrow").click(function(){
    $("#footer").animate({"top": "+=100px"}, "slow");
    $("#uarrow").animate({"top": "-=50px"}, "slow");
    $("#darrow").animate({"top": "+=100px"}, "slow");
  });
});

$(document).ready(function(){
  $("#uarrow").click(function(){
    $("#footer").animate({"top": "-=100px"}, "slow");
    $("#uarrow").animate({"top": "+=50px"}, "slow");
    $("#darrow").animate({"top": "-=100px"}, "slow");
  });
});

Answers


I believe you meant this to be #darrow:hover. You are overwriting the original opacity.

You need:

#darrow:hover, #uarrow:hover
{
    opacity: 1.0;
} 

and you have:

#darrow, #uarrow:hover
{
    /* this is replacing the previous opacity of 0.7 for #darrow */
    opacity: 1.0;
}

Need Your Help

ASP.NET Web API return queryable DTOs?

asp.net linq entity-framework asp.net-web-api

I built a nice little API with the ASP.NET Web API, but I guess it's not right to return the entities from my context (entity framework) AsQueryable, so I'm mapping everything to DTO objects.

Bluetooth Low Energy: Read/Write to sensors attached to RedBearLab Shield

bluetooth arduino bluetooth-lowenergy bluez

I have the RedBearLab BLE shield connected to Arduino UNO R3. I can connect to it using gatttool from a Rasp-Pi (attached CSR4.0 dongle). I have some sensors (FSR) connected to the analog pin and LED