WordPress.org

Forums

Java script for subscribe window (1 post)

  1. cybercli
    Member
    Posted 4 years ago #

    I have been using a div style floating window for a subscribe successfully on another website but am having a problem getting it to run on the wordpress theme Elegant Grunge. Here is the script in the header.php

    <?php wp_head(); ?>
    
    <!--Message Box JS-->
    <script>
    function closeBox(toClose) {
    	document.getElementById(toClose).style.display = "none";
    	setCookie(toClose, "closed", 365);
    }
    function setCookie(cName, value, expiredays) {
    	var expDate = new Date();
    	expDate.setDate(expDate.getDate()+expiredays);
    	document.cookie=cName + "=" + escape(value) +
    	";expires=" + expDate.toGMTString();
    }
    function loadMsg(msgClass) {
    	msg = document.getElementsByTagName("div");
    	for (i=0; i<msg.length; i++) {
    		if(msg[i].className == msgClass) {
    			if(document.cookie.indexOf(msg[i].id) == -1) {
    				msg[i].style.display = "block";
    			}
    		}
    	}
    }
    </script>
    </head>

    Basically it allows the window to appear only if a cookie does not exist. It uses a call up in the body tag like so:

    <body onload="loadMsg('msgbox');">
    <div id="page">
    	<div id="message-1" class="msgbox">
    	<a href="#" class="close" onclick="closeBox('message-1'); return false;" title="Close This Box">X</a>
    	<?PHP include('signup.php'); ?>
    	</div>

    However, the body tag for this theme is different than the others and I don't know where to put the call uponload="loadMsg('msgbox');"
    <body <?php if ( defined('EG_BODY_CLASS') ) echo 'class="'.EG_BODY_CLASS.'"'; ?>>
    Here is the CSS:

    /*Begin message box*/
    #message-1 {
    
    }
    .msgbox {
    	display: none; /* Start out hidden. */
    	position: fixed;
    	top: 0px;
    	right: 0px;
    	width: 425px;
    	background-color: #F3F4EE;
    	border: 1px solid #333;
    	/*color: #fff;
    	font-weight: bold; */}
    .msgbox p {
    	margin: 0;
    	padding: 5px 10px; }
    .msgbox a.close {
    	float: right;
    	text-decoration: none;
    	font-weight: bold;
    	color: #333;
    	background-color: #fff;
    	border-left: 1px solid #333;
    	border-bottom: 1px solid #333;
    	padding: 0 4px;
    	margin-left: 5px;
    }
    /*End Message Box*/

    Any help would be appreciated

Topic Closed

This topic has been closed to new replies.

About this Topic