0

I'm trying to implement a very simple vertical slide down panel in Wordpress, I've tried jbar (http://tympanus.net/codrops/2009/10/29/jbar-a-jquery-notification-plugin/) and an easy JS method I found in http://jsfiddle.net/ahr3U/

But I still cannot get this implemented, I've tried inserting the below code in the footer.php right before it's close, and within the header.php and still nothing appears.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">
<script>

$(document).ready(function(){
    $("#notification").addClass("visible");
});

</script>

And CSS:

#notification {
    background-color: #F00;
    color: #FFF;
    height: 25px;
    position: absolute;
    top: -25px;
    width: 100%;
    transition: top 0.5s;
    -moz-transition: top 0.5s;
    -webkit-transition: top 0.5s;
    -o-transition: top 0.5s;
}

#notification.visible {
    top: 0px;
}

The HTML CTA via the div, I've tried calling with the <head> and <body>

<div id="notification">Page load complete...</div>
Improve this question

1 Answer 1

Reset to default
2

In order to be compatible with other libraries, jQuery loads in "no conflict" mode by default . Try rewriting your code to use the jQuery keyword instead of $.

jQuery(function ($) {
    $("#notification").addClass("visible");
});
Improve this answer
3
  • So it's implemented now. BUT, the above the fold area is blank upon page load. When you scroll below the 'above-the-fold' and then scroll back up, the content there appears. Weirdest thing ever. Any ideas?
    – Lieutenant Dan
    Commented Feb 6, 2012 at 18:45
  • I'd have to see the page.
    – Kyle
    Commented Feb 6, 2012 at 18:49
  • It was a confliction with other plugins I had implemented apparently, once deactivated - boom.
    – Lieutenant Dan
    Commented Feb 6, 2012 at 19:12

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.