Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Jan 2012
    Posts
    84
    Thanks
    49
    Thanked 0 Times in 0 Posts

    Weird, Page loading approx 300px from top.

    Hey Guys,

    A bit stumped with this one....
    The index.php and reviews.php pages of my site load about 300px below the top of the page... http://www.hedgevent.com
    http://hedgevent.com/reviews.php

    here is the homepage code and CSS below. excuse the messy coding -- this is my very first site...

    PHP Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta charset="utf-8" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link href="style.css" rel="stylesheet" type="text/css" />
    <title>Hedge Fund Events</title>
    <style type="text/css">
    body {
        background-image:url('background.png');
    }
    </style>
        <script type="text/javascript" src="js/search.js"></script>
        <script type="text/javascript" src="js/pagination.js"></script>
        <script> htmlData('search.php', ''); </script>
    <style type="text/css">
    #sidebar img {
    margin-bottom:10px;
    }
    </style>
    <script type="text/javascript">

      var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-28203080-1']);
      _gaq.push(['_trackPageview']);

      (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
      })();

    </script>
    </head>

    <body>
    <div class=wrapper> 
      <section id="bar">
              <div class="header">
                <div class="logo"><a href="index.php"><img src="logo.png"HEIGHT="80" width="200"/></a>
                </div>
                <div class="banner"><a href=http://www.thomsonreuters.com/><img src="thomson.gif"/></a>
                </div>
            </div>
              <div class="navbar">
                
          <ul class="firstbar">
            <li><a href="index.php">Hedge Fund Events</a> </li>
            <li><a href="calendar.php">Events Calendar</a> </li>
            <li><a href="reviews.php">Submit Reviews</a> </li>
            <li><a href="addevents.php">Add Events</a> </li>
            <li><a href="directory.php">HF Vendors</a> </li>
          </ul>
          <ul class="secondbar">
            <li><a href="contact.html">Contact</a></li>
            <li><a href="adratetest.pdf">Advertise</a></li>
          </ul>
       
        </div>
      </section>
          <div id="container">
         <div id="listing">
          <!-- begin content -->
          <div id="content"> 
            <!-- begin form -->
            <div id="form">
              <input type="text" id="terms" size="40" onkeyup="getScriptPage('show_results','terms','1')" onblur="if ( this.value == '' ) this.value = this.defaultValue" onfocus="if ( this.value == this.defaultValue ) this.value = ''" value="type your search here" />
            </div>
            <!-- end form --> 
          </div>
          <!-- end content --> 
          <span class='add'><a href='addevents.php' title='Add Event'>Add Event</a></span><p> ex. search by event, company, keyword, or city</p><br>
          <!-- begin counter display -->
          <div id="show_results"></div>
          <!-- end counter display -->   
          
          
          <p style="font-family:arial;color:#C33;font-size:18px;margin-left: 35px "> 
          <a href="http://www.hedgevent.com/calendar.php?month=1&year=2012">Jan</a> | 
          <a href="http://www.hedgevent.com/calendar.php?month=2&year=2012">Feb</a> |
          <a href="http://www.hedgevent.com/calendar.php?month=3&year=2012">Mar</a> |
          <a href="http://www.hedgevent.com/calendar.php?month=4&year=2012">Apr</a> |
          <a href="http://www.hedgevent.com/calendar.php?month=5&year=2012">May</a> |
          <a href="http://www.hedgevent.com/calendar.php?month=6&year=2012">Jun</a> |
          <a href="http://www.hedgevent.com/calendar.php?month=7&year=2012">Jul</a> |
          <a href="http://www.hedgevent.com/calendar.php?month=8&year=2012">Aug</a> |
          <a href="http://www.hedgevent.com/calendar.php?month=9&year=2012">Sep</a> |
          <a href="http://www.hedgevent.com/calendar.php?month=10&year=2012">Oct</a> |
          <a href="http://www.hedgevent.com/calendar.php?month=11&year=2012">Nov</a> |
          <a href="http://www.hedgevent.com/calendar.php?month=12&year=2012">Dec</a>     
          </p>
          <br>
          <img src="hrline.png" HEIGHT="7" width="630"><br>
          <br>
          <h1 style="color:#999;margin-left: 205px">Upcoming Events</h1>
          <br>
          <div id="listing2">
          <?php
    require 'connect.inc.php';

    $query "SELECT id, event, company, location, city, month, day, year FROM calendar_event WHERE 
                year > '"
    .date("Y")."' || 
                (year = '"
    .date("Y")."' && month > '".date("m")."') || 
                (year = '"
    .date("Y")."' && month = '".date("m")."' && day >= '".date("d")."')  
                    ORDER by month,day ASC"


    if (
    $query_run mysql_query($query)) {
       while (
    $query_row mysql_fetch_assoc($query_run) ) {
          
    $id$query_row ['id'];
          
    $event$query_row ['event'];
          
    $company$query_row ['company'];
          
    $location$query_row ['location'];
          
    $city$query_row ['city'];
          
    $month$query_row ['month'];
          
    $day$query_row ['day'];              
          
    $year$query_row ['year'];
          
          
    $urlevent str_replace(" ","_"$event);
          
          echo 
    '<div class="where"><a href="http://www.hedgevent.com/details/'.$urlevent.'-'.$id.'.html" class="event">'.$event.'</a></div>'.$company.'<div class="date">'.$month.'/'.$day.'/'.$year.'</div><br>'.$location.', '.$city.'<br><hr style= margin-top:5px;margin-bottom:5px;/>';
        }

    }
    else{
    echo 
    mysql_error();
    }
    ?>
        </div>
        </div>
        <div id="vrule"><img src="vrline.png" HEIGHT="30800" width="12"></div>
        
        <div id="sidebar">  <a href=http://www.advent.com/><img src="geneva.gif" HEIGHT="160" width="160"></a><a href=http://www.emirates.com/><img src="emirates.gif" HEIGHT="600" width="160"></a><a href=http://www.http://network.managedfunds.org//><img src="network.jpg" HEIGHT="600" width="160"></a><a href=http://www.convergex.com/><img src="convergex.gif" HEIGHT="600" width="160"></a><a href=http://www.ezecastle.com/><img src="ezecastle.gif" HEIGHT="600" width="160"></a><a href=http://http://www.maplesfundservices.com//><img src="maples.jpg" HEIGHT="600" width="160"></a><a href=http://www.sungard.com/><img src="sungard.gif" HEIGHT="600" width="160"></a><a href=http://www.ogier.com/><img src="ogier.gif" HEIGHT="600" width="160"></a><a href=http://www.scotia.com/><img src="scotia.gif" HEIGHT="600" width="160"></a><a href=http://www.sabrefund.com/><img src="sabre3.gif" HEIGHT="600" width="160"></a><a href=http://www.edhec.edu/><img src="edhec.jpg" HEIGHT="600" width="160"></a><img src="geneva.gif" HEIGHT="160" width="160"><a href=http://http://www.emirates.com/><img src="emirates.gif" HEIGHT="600" width="160"></a><a href=http://www.http://network.managedfunds.org//><img src="network.jpg" HEIGHT="600" width="160"></a><a href=http://www.convergex.com/><img src="convergex.gif" HEIGHT="600" width="160"></a><a href=http://www.ezecastle.com/><img src="ezecastle.gif" HEIGHT="600" width="160"></a><a href=http://http://www.maplesfundservices.com//><img src="maples.jpg" HEIGHT="600" width="160"></a><a href=http://www.sungard.com/><img src="sungard.gif" HEIGHT="600" width="160"></a><a href=http://www.ogier.com/><img src="ogier.gif" HEIGHT="600" width="160"></a><a href=http://www.scotia.com/><img src="scotia.gif" HEIGHT="600" width="160"></a><a href=http://www.sabrefund.com/><img src="sabre3.gif" HEIGHT="600" width="160"></a><a href=http://www.edhec.edu/><img src="edhec.jpg" HEIGHT="600" width="160"></a><img src="geneva.gif" HEIGHT="160" width="160"><a href=http://http://www.emirates.com/><img src="emirates.gif" HEIGHT="600" width="160"></a><a href=http://www.http://network.managedfunds.org//><img src="network.jpg" HEIGHT="600" width="160"></a><a href=http://www.convergex.com/><img src="convergex.gif" HEIGHT="600" width="160"></a><a href=http://www.ezecastle.com/><img src="ezecastle.gif" HEIGHT="600" width="160"></a><a href=http://http://www.maplesfundservices.com//><img src="maples.jpg" HEIGHT="600" width="160"></a><a href=http://www.sungard.com/><img src="sungard.gif" HEIGHT="600" width="160"></a><a href=http://www.ogier.com/><img src="ogier.gif" HEIGHT="600" width="160"></a><a href=http://www.scotia.com/><img src="scotia.gif" HEIGHT="600" width="160"></a><a href=http://www.sabrefund.com/><img src="sabre3.gif" HEIGHT="600" width="160"></a><a href=http://www.edhec.edu/><img src="edhec.jpg" HEIGHT="600" width="160"></a><img src="geneva.gif" HEIGHT="160" width="160"><a href=http://http://www.emirates.com/><img src="emirates.gif" HEIGHT="600" width="160"></a><a href=http://www.http://network.managedfunds.org//><img src="network.jpg" HEIGHT="600" width="160"></a><a href=http://www.convergex.com/><img src="convergex.gif" HEIGHT="600" width="160"></a><a href=http://www.ezecastle.com/><img src="ezecastle.gif" HEIGHT="600" width="160"></a><a href=http://http://www.maplesfundservices.com//><img src="maples.jpg" HEIGHT="600" width="160"></a><a href=http://www.sungard.com/><img src="sungard.gif" HEIGHT="600" width="160"></a><a href=http://www.ogier.com/><img src="ogier.gif" HEIGHT="600" width="160"></a><a href=http://www.scotia.com/><img src="scotia.gif" HEIGHT="600" width="160"></a><a href=http://www.sabrefund.com/><img src="sabre3.gif" HEIGHT="600" width="160"></a><a href=http://www.edhec.edu/><img src="edhec.jpg" HEIGHT="600" width="160"></a><img src="geneva.gif" HEIGHT="160" width="160"><a href=http://http://www.emirates.com/><img src="emirates.gif" HEIGHT="600" width="160"></a><a href=http://www.http://network.managedfunds.org//><img src="network.jpg" HEIGHT="600" width="160"></a><a href=http://www.convergex.com/><img src="convergex.gif" HEIGHT="600" width="160"></a><a href=http://www.ezecastle.com/><img src="ezecastle.gif" HEIGHT="600" width="160"></a><a href=http://http://www.maplesfundservices.com//><img src="maples.jpg" HEIGHT="600" width="160"></a><a href=http://www.sungard.com/><img src="sungard.gif" HEIGHT="600" width="160"></a><a href=http://www.ogier.com/><img src="ogier.gif" HEIGHT="600" width="160"></a><a href=http://www.scotia.com/><img src="scotia.gif" HEIGHT="600" width="160"></a><a href=http://www.sabrefund.com/><img src="sabre3.gif" HEIGHT="600" width="160"></a></div>
        
      
    </div>
    </div>
    <footer> 
    </footer>
    </body>
    </html>
    Code:
    @charset "utf-8";
    *{
    	margin:0px;
    	padding:0px;
    	text-decoration: none;
    	list-style: none;
    }
    
    .wrapper{
    	max-width:940px;
    	margin-left:auto;
    	margin-right:auto;
    	margin-top:10px;
    }
    
    .header {
    	margin: auto;
    	margin-top: 20px;
    	width: 940px;
    	height:90px;
    	
    }
    .logo {
    	background: no-repeat top left;
    	width: 140px;
    	height: 90px;
    	position: relative;
    	float: left;
    	margin-bottom:5px;
    }
    .banner {
    	background: no-repeat top right;
    	width: 728px;
    	height: 90px;
    	position: relative;
    	float: right;
    	
    }
    .navbar {
    	margin: auto;
    	margin-top: 20px;
    	width: 940px;
    	height: 65px;
    	background: url(navbar_bg.jpg) no-repeat top center;
    	font: normal 15px Arial, Helvetica, sans-serif;
    	color: #666;
    }
    .navbar.firstbar {
    	width: 700px;
    	position: relative;
    	float: left
    }
    .navbar .secondbar {
    	width: 220px;
    	float: right
    }
    .navbar .firstbar li, .navbar .secondbar li {
    	float: left
    }
    .navbar .firstbar li a, .navbar .secondbar li a {
    	padding: 0px 15px;
    	height: 45px;
    	background: url(sep.png) no-repeat top left;
    	font-weight: bold;
    	line-height: 45px;
    	color: #666;
    	display: block;
    	float: left
    }
    .navbar .secondbar li a {
    	padding: 0px;
    	width: 110px;
    	color: #CCC;
    	text-align: center
    }
    .navbar .secondbar li a:hover {
    	color: #FFF
    }
    .navbar .firstbar li:hover {
    	height: 65px;
    	background: url(arr.png) no-repeat center bottom
    }
    .navbar .firstbar li:hover .sub_navbar, .navbar .firstbar li:hover .col4, .navbar .firstbar li:hover .col2 {
    	position: absolute;
    	top: 65px;
    	left: 0px;
    	display: block
    }
    
    #container {
    	width: 870px;
    	margin: 20px auto;
    	padding: 35px;
    	border: 1px solid #cbcbcb;
    	background-color: #FFF;
    	
    	-webkit-border-radius:5px;
    	-moz-border-radius:5px;
    	border-radius:5px;
    
    	box-shadow: 0 2px 5px rgba(50, 50, 50, 0.1);
    	-webkit-box-shadow: 0 2px 5px rgba(50, 50, 50, 0.1);
    	-moz-box-shadow: 0 2px 5px rgba(50, 50, 50, 0.1);
    }
    #listing{
    	width:630px;
    	float: left;
    	font-weight: bold;
    	font-family: arial;
    	color: #73ABCA;
    	-moz-box-flex:1;
    	-webkit-box-flex:1;
    }
    div.where {
    	font-size: 19px;
    	font-family: arial; 
    	font-weight:500;
    	color: #C33
    }
    div.date{
    	float: right;
    }
    #listing2{
    	width:630px;
    	font-size: 16px;
    	font-family: calibri;
    	font-weight: 300;
    	color: #999;
    	float: left;
    	-moz-box-flex:1;
    	-webkit-box-flex:1;
    }
    hr {
    	border-bottom:1px dotted #E6E6E6;);
    	}
    input { 
    	width: 340px;
    	padding: 15px;
    	color: #666;
    	background: #f5f5f5;
    	border: 1px solid #ccc;
    	margin: 0px 0;
    	font:1em "Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif;
    	-webkit-border-radius:8px;
    	-moz-border-radius:8px;
    	border-radius:8px;
    	vertical-align: top;
    
    	transition: all 0.25s ease-in-out;
    	-webkit-transition: all 0.25s ease-in-out;
    	-moz-transition: all 0.25s ease-in-out;
    
    	box-shadow: 0 0 8px rgba(81, 203, 238, 0);
    	-webkit-box-shadow: 0 0 8px rgba(81, 203, 238, 0);
    	-moz-box-shadow: 0 0 8px rgba(81, 203, 238, 0);
    }
    #vrule{
    	max-width:15px;
    	display:inline;
    	margin-top:160px;
    	margin-left: 35px;
    }
    #sidebar{
    	max-width:160px;
    	float: right;
    }
    span.add a { height:52px; width:250px; text-indent:-9999px; background:url(add.png) bottom no-repeat; float:right; margin-top:-53px; margin-right:0px; }
    span.add a:hover { background-position:top; }	
    
    
    a, a:visited { color:#626262; text-decoration:none; }
    a:hover { color:#818181; text-decoration:none; }
    
    
    /* search results */
    #results { width:625px; position:relative; margin:20px auto; padding:0; }
    
    /* search results top panel */
    
    /* search results bottom panel */
    #results_bottom { width:507px; height:25px; padding:10px 0 0 18px; }
    #results_bottom p {margin:0; padding:8px 0; width:600px; height:22px; text-align:center; color:#ff8a00; font-weight:bold; }
    #results_bottom a, #results_bottom a:visited { text-decoration:none; color:#73abca; display:inline-block; padding:3px; font-weight:normal; }
    #results_bottom a:hover { color:#ff8a00; }
    
    .item { background:#FFF; width:630px; margin:0 8px; padding:8px 0; border-bottom:1px dotted #E6E6E6; }
    .details { width:390px; float:left; padding:0 5px 0 10px; font-size:14px; }
    .details img { margin:0 8px 0 2px; padding:3px; border:1px solid #e8eff1; }
    .title, .title:visited { color:#ff8a00; text-decoration:none; font-weight:bold; font-size:14px; }
    .title:hover { color:#e07000; }
    .details p { padding:5px 0 0 0; margin:0; }
    
    .details span { font-weight:bold; color:#ff0000; background-color:#ffff00; } /* highlight text */
    
    .played { width:110px; float:right; padding:0 10px 0 5px; height:35px; text-align:center; }
    .played span, #played span span { color:#ff8a00; font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; font-size:14px; font-weight:bold; margin:0; padding:0; }
    .played p { margin:4px 0; padding:0; font-size:10px; }
    .played p span { margin:0; padding:0; font-size:10px; color:#73abca; font-family:Verdana, Geneva, sans-serif; font-weight:normal; font-style:normal; }
    }
    
    footer {
    	background-image: url(footer.png);
    	background-repeat:repeat-x;	
    }

  • #2
    Regular Coder
    Join Date
    Sep 2011
    Posts
    330
    Thanks
    3
    Thanked 35 Times in 35 Posts
    Hey there,

    There are scroll functions in javascript, and when I disable javascript rendering in my browser, the problem doesn't occur. So see what happens if you disable the javascripts in your code one by one.
    Frank

    How to: Target IE in, Position in, Center in, Create a Fixed ('Sticky') Footer with, and Create a Drop-Down/Fly-Out Menu with CSS: Website Laten Maken Amsterdam.

  • #3
    Senior Coder coothead's Avatar
    Join Date
    Jan 2004
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    1,696
    Thanks
    0
    Thanked 232 Times in 227 Posts
    Hi there jchrisphonte,

    the cause of your problem appears to be this....
    Code:
    
    <script type="text/javascript" src="js/pagination.js"></script>
    
    In that script there is this line of code...
    Code:
    
    document.getElementById("show_results").scrollIntoView();</script>
    
    If you change it to...
    Code:
    
    //document.getElementById("show_results").scrollIntoView();</script>
    
    ...your page will start at the top.

    coothead


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •