Archived Site

by Dan Wright

HTML

<div id="container">
    <div id="archived-site">
        <div class="inner">
             <h2>This site has been archived</h2> 
            <p>This is an archived site. To view the latest HEA material relating to your subject please visit the HEA disciplines page <a href="#">here</a> and select your chosen discipline</p>
            <ul>
                <li><a href="#" id="archived-msg">Remove</a>

                </li>
                <li><a href="#" id="archived-more">More Info</a>

                </li>
            </ul>
        </div>
        <div id="archived-info">
             <h3>Further Information</h3> 
            <p>For further information read this!</p>
        </div>
    </div>
</div>

CSS

/*Archived site*/

#archived-site {
    float: left;
    width: 100%;
}
#archived-site .inner {
    padding: 2em 2em 2em 164px;
    overflow: auto;
    background: #EEE url(url.png) no-repeat 18px 50%;
}
#archived-site h2 {
    font-size: 1.5em;
    margin-bottom: 0.5em;
    color: #D90000;
}
#archived-site p {
    margin-bottom: 1em;
    line-height: 1.4em;
}
#archived-site p a {
    color: #D90000;
    font-weight: bold;
}
#archived-site li {
    float: left;
    list-style: none;
}
#archived-site li a {
    float: left;
    padding: 0.5em 0.5em;
    background: #D90000;
    color: #fff;
    text-decoration: none;
    margin-right: 0.5em;
}
#archived-site li a:hover {
    background: #000;
}
#archived-info {
    background:#D90000;
    position:inherit;
    display:none;
}

JavaScript

$(document).ready(function () {
    archivedWatermark();
    archivedNotification();
});

function archivedWatermark() {
    $('#container').addClass('archived');
    $('#container').css({
        'background': 'url(../assets/images/New-to-Teaching/EnhancingHolisticAspects-Icon-Thought-Bubbles.png)',
            'position': 'relative',
            'z-index': '99999',
            'pointer-events': 'all'
    });
}

function archivedNotification() {
    archivedMsgRemove();
    archivedMoreInfo();
}

function archivedMsgRemove() {

    $('#archived-msg').click(function () {
        $('#archived-site').remove();
        alert('msg removed');
    });
}

function archivedMoreInfo(){

	var moreInfo = $('#archived-info');
	
	$('#archived-more').click(function(info){
	
		if (moreInfo.is(':hidden')){
			moreInfo.slideDown('fast');
		} else {
			moreInfo.slideUp('fast');	
	}
	info.preventDefault();
	});
}