JavaScript - Simple Javascript Pop Up Window Problem

function dropDown(id){
    var object = document.getElementById(id).style;
    
    if (object.display == "none") {object.display = "block"}
    else {object.display = "none"}
    }

<div id="webBox" class="service">
<ul class="servNav">
    <li class="button" onclick="dropDown('webDrop')">View Details</li>
</ul>
</div>
<div class="dropInfo" id="webDrop">

http://web.enavu.com/demos/caption/

http://www.sohtanaka.com/web-design/examples/image-hover/

                    <div class="main_view">
                        <div class="window">    
                            <div class="image_reel">
                    			<a href="#">
                                    <img style="height:534px;" src="http://i55.tinypic.com/.png" alt="" />
                                </a>
                                <a href="<?php echo get_permalink(253); ?>">
                                    <img src="http://i51.tinypic.com/.jpg" alt="" />
                                </a>
                                <a href="<?php echo get_permalink(256); ?>">
                                    <img src="http://i52.tinypic.com/.png" alt="" />
                                </a>
                                <a href="<?php echo get_permalink(258); ?>">
                                    <img src="http://i53.tinypic.com/.png" alt="" />
                                </a>
                                <a href="<?php echo get_permalink(271); ?>">
                                    <img src="http://i53.tinypic.com/.png" alt="" />
                                </a>
                            </div>
		<div class="descriptions">
			<!--welcome page-->
				<div class="desc">
					<strong style="font-size:30px;">Welcome to City Water</strong>
						<div class="clear"></div><br/>
                            <div id="sliderdescription">WHATEVER WHATEVER</div>

				</div>
                
			<!--Services page-->
			<div class="desc">
			<?php $post_id = 253; $queried_post = get_post($post_id); ?>
       <strong style="font-size:30px;"><?php echo $queried_post->post_title; ?></strong>
                        <div class="clear"></div><br/>
                            <div id="sliderdescription"><?php echo $queried_post->post_content; ?></div>
                </div>
                    <div class="desc">
                                        <!--Products page-->
<?php $post_id = 256; $queried_post = get_post($post_id); ?>
<strong style="font-size:30px;"><?php echo $queried_post->post_title; ?></strong><div class="clear"></div>
<br/><div id="sliderdescription"><?php echo $queried_post->post_content; ?></div>


                    </div>
                    <div class="desc">
                                                 <!--Information page-->
<?php $post_id = 258; $queried_post = get_post($post_id); ?>
<strong style="font-size:30px;"><?php echo $queried_post->post_title; ?></strong><div class="clear"></div>
<br/><div id="sliderdescription"><?php echo $queried_post->post_content; ?></div>


                    </div>
                    <div class="desc">
                                                 <!--Accounts page-->
<?php $post_id = 271; $queried_post = get_post($post_id); ?>
<strong style="font-size:30px;"><?php echo $queried_post->post_title; ?></strong><div class="clear"></div>
<br/><div id="sliderdescription"><?php echo $queried_post->post_content; ?></div>
                    </div>
                </div>
            </div>
            
<div id="hrline"></div>

 <div class="paging">
         <ul class="thumb">
<li><a href="#" rel="1"><img src="http://i55.tinypic.com/.png" class="thumbnails"/></a></li>
<li><a href="#" rel="2"><img src="http://i56.tinypic.com/.jpg" class="thumbnails"/></a></li>
<li><a href="#" rel="3"><img src="http://i51.tinypic.com/.png" class="thumbnails"/></a></li>
<li><a href="#" rel="4"><img src="http://i52.tinypic.com/.png" class="thumbnails"/></a></li>
<li><a href="#" rel="5"><img src="http://i52.tinypic.com/.png" class="thumbnails"/></a></li>
        </ul>
    </div>
 </div>

 /*--Main Container--*/
 .main_view {
  float : left;
  height :488px;
  margin-bottom :1px;
  margin-top :-40px;
  position :relative;
}

 /*--Window/Masking Styles--*/
 .window img{
  height :492px;
  width : 974px;
}

 .window {
  /*--Hides anything outside of the set width/height--*/
  border :3px solid #D7D7D5;
  color : #B4B4B4;
  font-size : 12px;
  font-weight : bold;
  height :488px;
  overflow : hidden;
  position : relative;
  width : 974px;
}

 .image_reel {
  left : 0;
  position : absolute;
  top : 0;
}

 .image_reel img {
  float : left;
}

 .image_reel ul li {
  display : inline;
}

  #image_reel .caption {
  background-color :#000;
  bottom :0;
  color :#ffffff;
  height :100px;
  position :absolute;
  width :100%;
  z-index :600;
}

    #image_reel .caption .content {
}

    #image_reel .caption .content h3 {
  color :#1DCCEF;
  margin :0;
  padding :0;
}

 /*--Paging Styles--*/
 .paging {
  /*--Assures the paging stays on the top layer--*/
  /*--Hidden by default, will be later shown with jQuery--*/
  bottom : -25px;
  display : none;
  line-height : 40px;
  position : absolute;
  right : -70px;
  text-align : center;
  z-index : 100;
}



.desc {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 101;
	margin-top:275px;
    color: white;
    font-size: 2em;
    padding: 7px;

}

$(document).ready(function() {

    //Set Default State of each portfolio piece
    $(".paging").show();
    $(".paging a:first").addClass("active");
        
    //Get size of images, how many there are, then determin the size of the image reel.
    var imageWidth = $(".window").width();
    var imageSum = $(".image_reel img").size();
    var imageReelWidth = imageWidth * imageSum;
    
    //Adjust the image reel to its new size
    $(".image_reel").css({'width' : imageReelWidth});
    
    //Paging + Slider Function
    rotate = function(){    
        var triggerID = $active.attr("rel") - 1; //Get number of times to slide
        var image_reelPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide

        hideComment();
        
        $(".paging a").removeClass('active'); //Remove all active class
        $active.addClass('active'); //Add active class (the $active is declared in the rotateSwitch function)
        
        //Slider Animation
        $(".image_reel").animate({
            left: -image_reelPosition
        }, 500 );
       
        showComment();
    };
    
    //Rotation + Timing Event
    rotateSwitch = function(){        
        play = setInterval(function(){ //Set timer - this will repeat itself every 3 seconds
            $active = $('.paging a.active').next();
            if ( $active.length === 0) { //If paging reaches the end...
                $active = $('.paging a:first'); //go back to first
            }
            rotate(); //Trigger the paging and slider function
        }, 7000); //Timer speed in milliseconds (3 seconds)
    };
    
    rotateSwitch(); //Run function on launch
    
    //On Hover
    $(".image_reel a").hover(function() {
        clearInterval(play); //Stop the rotation
        play = null;
    }, function() {
        rotateSwitch(); //Resume rotation
    });    
    
    showComment = function(){
        // slide toggle effect set to slow you can set it to fast too.
        $(".desc").eq( $('.paging a.active').attr("rel") - 1 ).show(700);
        return true;
    };
    
    showComment(); // Show Comment initially
    
     hideComment = function(){
        $(".desc").stop(true,true).slideUp(500).hide();
     };
    
    //hide comment if you click on it
    $(".desc").click(function(){
        hideComment();
    });
    
    //On Click
    $(".paging a").click(function() {    
        $active = $(this); //Activate the clicked paging
        //Reset Timer
        clearInterval(play); //Stop the rotation
        rotate(); //Trigger rotation immediately
        rotateSwitch(); // Resume rotation
        return false; //Prevent browser jump to link anchor
    });    
    
});

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 2</title>
</head>

<SCRIPT LANGUAGE = JavaScript>


	function estimateHolidays() 
	{

		var service1;
		var service2;
		var service3;
		var txtGrade;
		var txtHolidays;
                var dblEntitlement;
		var strService;
		

		strService = cmbService.value;


		if (strService == "Service1") 
		{
		dblEntitlement = 20;
		}
		else if (strService == "Service2" && Grade--"1")
		{
		dblEntitlement = 24; 
		}
		else if (strService == "Service2" && Grade--"2") 
		{
		dblEntitlement = 26; 
		}
		else if (strService == "Service2" && Grade--"3") 
		{
		dblEntitlement = 28; 
		}
		else if (strService == "Service3")
		{
		dblEntitlement = 30; 
		}
		else 
		{ 
		dblEntitlement = "Error!  Please try again."; 
		}	

		txtHoliday.value = dblEntitlement;


	}


</SCRIPT>


<body>

	<p>
	<input name="txtGrade" size="25" value="Enter Your Staff Grade">
	</p>

	<p>
	Years of Service: <select name="cmbService" size="1">
	<option value="Service1">Less than 5 years service</option>
	<option value="Service2">5 to 9 years service</option>
	<option value="Service3">10 or more years of service</option>
	</select> 
	</p>

	<p>
	<input type="button" value="Estimate Holidays" name="cmdEstimateHolidays" onclick="estimateHolidays()">
	</p>

	<p>
	Holiday Entitlement: <input name="txtHolidays" size="25">
	</p>

</body>
</html>

<html>
<head>
<title>Prva</title>
<style type="text/css"> 
span.Pozitivno
{
	color:green;
	font-weight:bold;
}
span.Negativno
{
	color:red;
	font-weight:bold;
}
</style>
<script type="text/javascript">
function vpisi_stevila()
{
	var a;
	var b;

	//Vnos spremenljivk
	a=prompt("Vnesi stevilo a:")
	b=prompt("Vnesi stevilo b:")
	
	a=a*1 //S tem spremenimo string v int
	b=b*1

	//Izpis stevil
	if(a<0)
	{
		document.write("A:<span class='Negativno'> " + a + " </span> <br />");
	}
	else
	{
		document.write("A:<span class='Pozitivno'> " + a + " </span> <br />");
	}
	if(b<0)
	{
		document.write("A:<span class='Negativno'> " + a + " </span> <br />");
	}
	else
	{
		document.write("A:<span class='Pozitivno'> " + a + " </span> <br />");
	}
	
	document.write("Vsota:", a+b, "<br />");
	document.write("Razlika:", a-b, "<br />");
	document.write("Mnozenje:", a*b, "<br />");
	document.write("Deljenje:", a/b, "<br />");
	document.write("Ostanek:", a%b, "<br />");
	
	
	if(a>b) //Ce je A vecje od B
	{
		document.writeln("A je <b>večje </b> od b")
	}
	if(a<b) //Ce je B vecje od A
	{
		document.writeln("A je <b>manjse </b> od b")
	}
	if(a==b) //Ce sta enaka
	{
		document.writeln("A je <b>enako </b> b")
	}
}
</script>
</head>
<body onload="vpisi_stevila()">


</body>
</html>

<a href=\"javascript:if(confirm('Are you sure this offer is not working and wish to report it?;?')){document,location.href='report.php?offername=".$row['name']."&offerid=".$row['offerid']."';}\">Report</a>