[Resolved] Popup Code Issue (Not Appearing)

[Mr McMarry]

Hello Guys :

Code :

Javascript :

$(document).ready(function()
{
    /******************
    COOKIE NOTICE
    ******************/
    if(getCookie('show_cookie_message') != 'no')
    {
        $('#cookie_box').show();
    }

    $('.cookie_box_close').click(function()
    {
        $('#cookie_box').animate({opacity:0 }, "slow");
        setCookie('show_cookie_message','no');
        return false;
    });
});

function setCookie(cookie_name, value)
{
    var exdate = new Date();
    exdate.setDate(exdate.getDate() + (365*25));
    document.cookie = cookie_name + "=" + escape(value) + "; expires="+exdate.toUTCString() + "; path=/";
}

function getCookie(cookie_name)
{
    if (document.cookie.length>0)
    {
        cookie_start = document.cookie.indexOf(cookie_name + "=");
        if (cookie_start != -1)
        {
            cookie_start = cookie_start + cookie_name.length+1;
            cookie_end = document.cookie.indexOf(";",cookie_start);
            if (cookie_end == -1)
            {
                cookie_end = document.cookie.length;
            }
            return unescape(document.cookie.substring(cookie_start,cookie_end));
        }
    }
    return "";
}

CSS

#cookie_box
{ 
	position: fixed;
	display: none;
	bottom: 0px;
	font-size: 0.8em;
	z-index: 1000;
	background:#393939;
	padding:5px;
	text-align:center;
	width:99%;
	color:#ffffff;
}
	#cookie_box a:hover
	{ 
		color:#ffffff;
		text-decoration: underline
	}

HTML
<div id="cookie_box">Our site requires cookies to function, <a href="/cookies">click here</a> for more information <a href="#" class="cookie_box_close">Close [X]</a></div>

i dont know whats wrong with the code when i remove display none and position fixed css it appears on site but dont close when i click close javascript is placed right tooo

[Mr McMarry]

Used jQuery(function ($) over $(document).ready(function()

Article : https://stackoverflow.com/questions/12343714/typeerror-is-not-a-function-when-calling-jquery-function

SOLVED

[David]

Glad to hear you got it resolved.

[Mr McMarry]

Sorry about this but when I click close X its opacity changes to 0, it doesn’t change to display: none; ?

which results in: no hover or click on the top navigation menu. Because its changes to opacity 0 i want it to display: none when i click X

[Tom]

Instead of:

$('#cookie_box').animate({opacity:0 }, "slow");

Try:

$('#cookie_box').animate({opacity:0 }, "slow").hide();

[Mr McMarry]

Wow, it Worked.

Is this Code ok I mean is there some bug?

[David]

Hi Arish, code looks fine, the author had not considered the ‘blocking’ event. Glad you got this resolved.

[Mr McMarry]

Can we add blocking event? i dont want to have any mess for this

[David]

Hi Arish, what i meant was the author hadn’t considered that the container could block content behind it. The code is fine as is.

[Mr McMarry]

oh, Very Well we solved it.

Thank You DAVID and TOM

[David]

You’re welcome, I am glad Tom could help 😉

[Author]

Posts