Skip navigation
sandyrojito
Currently Being Moderated

Links on website not working

Dec 12, 2012 1:55 AM

Tags: #help #links

Hi, following is the code for my website www.faithinpeace.org, on the main page of website in the the gray bar on the left has links almost on all the content but they are not functioning in the site, i have no clue what could be the problem, and the slide show controls dont work either, it could be the same problem as the links not working as the slide show controls are also clickable links but it could be something else too... please take a look and help me out with this, i really need to get this fixed ASAP...thanks

 

<!DOCTYPE html>

<!-- saved from url=(0024)http://faithinpeace.org/ -->

<html lang="en" dir="ltr" id="du-edu" crossriderapp5060="true" crossriderapp-plugins-5060="true"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8">

 

 

          <!-- mimic Internet Explorer 7 for president's micro-site -->

 

 

 

    <link href="./index_files/top_navigation_layout.css" rel="stylesheet" type="text/css" media="all">

    <link href="./index_files/slideshow.css" rel="stylesheet" type="text/css" media="screen">

           

    <!-- include css definitions for positioning the main body of page -->

    <link href="./index_files/index_layout.css" rel="stylesheet" type="text/css" media="all">

    <!-- include css definitions for positioning the bottom navigation elements -->

    <link href="./index_files/bottom_navigation_layout.css" rel="stylesheet" type="text/css" media="all">   

    <!-- include css definitions for formatting most inline text styles -->

    <link href="./index_files/text_styles.css" rel="stylesheet" type="text/css" media="all">

 

 

 

 

           <!-- include site-wide javascript functions -->

           <!-- TYPEKIT -->

 

 

           <script type="text/javascript" src="./index_files/jquery.imagegallery.2.0.js"></script>

          <script type="text/javascript">

          // This controls the slideshow

          // Set autoRotate to false if you want to "pause" the show

          jQuery( function () {

                    $('#content').gallery({

                              jsonSource: 'main/slideshow/image-lineup.json?v=2.0',

                              rotateSpeed: 6000,

                              autoRotate: true,

                              showNavigation: true,

                              pauseBeforeStart: 0

                    });

          });

           </script>

              

     

      <title>Peace University USA</title>

                       

                    <meta name="Description" content="An nnovative private institution in Washington DC, Peace University offers innovative and rigorous undergraduate, graduate and professional programs. The University is distinguished by its hands-on learning opportunities, strong faculty-student collaboration and global perspective. ">

                        <meta name="Keywords" content="university, Peace, degrees, bachelors degree, masters degree, doctorate, school of social work, alumni, public good">

                       

          <meta name="author" content="Peace University USA">

     <!--[if lt IE 9]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"><!--//--><!--[endif]---->

    

      <link rel="shortcut icon" href="http://faithinpeace.org/images/favicon.ico" sizes="16x16 32x32 48x48 57x57 144x144" type="image/gif">

    

      <link href="./index_files/style.css" rel="stylesheet" type="text/css" id="css">

      <link href="./index_files/home.css" rel="stylesheet" type="text/css" id="css">

      <script src="./index_files/jquery.min(3).js"><!--//--></script>

      <script src="./index_files/jquery-ui.min.js"><!--//--></script>

      <script src="./index_files/jquery.jFav_v1.0.js"><!--//--></script>

      <script src="./index_files/jquery.jCarouselLite.1.0.1-min.js"><!--//--></scri pt>

      <script src="./index_files/jquery.fancybox.pack.js"><!--//--></script>

      <script src="./index_files/jquery.mousewheel-3.0.6.pack.js"><!--//--></script >

      <link rel="stylesheet" href="./index_files/jquery.fancybox.css" type="text/css" media="screen">

      <script src="./index_files/scripts.js"><!--//--></script>

<script src="./index_files/home.js"><!--//--></script>

<script>

                                        var isAlert ="disabled";

                                        $(document).ready(function(e) {

                                                   if(isAlert == "active")

                                                            $("#gallery").addClass("isAlert");

                                 });

 

                                        //<![CDATA[

 

                                        var preload = new Array();

 

 

                                        //]]>

                                        </script>

      <script>

//<![CDATA[

                                        $(window).bind('load', function(){

                                        $(document.createElement('img')).bind('load', function(){if(preload[0]) this.src = preload.shift();}).trigger('load');

                                        });

                                        //]]>

function MM_swapImgRestore() { //v3.0

  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;

}

function MM_preloadImages() { //v3.0

  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();

    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)

    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}

}

 

 

function MM_findObj(n, d) { //v4.01

  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {

    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}

  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];

  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);

  if(!x && d.getElementById) x=d.getElementById(n); return x;

}

 

 

function MM_swapImage() { //v3.0

  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)

   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}

}

      </script>

 

 

<link  title="Peace University USA" rel="index">

  

   <style type="text/css">

   body {

          background-color: #000000;

          background-image: url(images/website%20background.jpg);

          background-attachment: fixed;

}

   body,td,th {

          color: #FFFFFF;

}

   a:link {

          color: #000;

}

a:visited {

          color: #000;

}

   #apDiv1 {

          position:absolute;

          width:531px;

          height:115px;

          z-index:7;

          background-image: url(images/logo.png);

          top: 1px;

}

   #du-edu body #globalFooter #footerLinksContainer #subFooter ul li a {

          text-align: left;

}

   #apDiv2 {

          position:absolute;

          width:396px;

          height:175px;

          z-index:6;

          top: 54px;

          left: 594px;

}

   .b {

          list-style-type: circle;

          color: #FFFFFF;

}

   #apDiv3 {

          position:absolute;

          width:200px;

          height:54px;

          z-index:-2147483648;

          left: 24px;

          top: 3px;

}

   #apDiv4 {

          position:absolute;

          width:592px;

          height:70px;

          z-index:6;

          left: 3px;

          top: -1px;

}

   #apDiv5 {

          position:absolute;

          width:200px;

          height:115px;

          z-index:-2147483648;

}

   #apDiv6 {

          position:absolute;

          width:200px;

          height:115px;

          z-index:10;

}

   </style>

 

 

<style type="text/css">

iframe.dealply-toast { right: -99999px !important; }iframe.dealply-toast.fastestext-revealed { right: 0px !important; }#apDiv7 {

          position:absolute;

          width:200px;

          height:743px;

          z-index:-2147483648;

          left: 585px;

          top: 19px;

}

#apDiv8 {

          position:absolute;

          width:469px;

          height:519px;

          z-index:15;

          left: 435px;

          top: 2px;

          opacity: 0.5;

}

#apDiv9 {

          position:absolute;

          width:299px;

          height:115px;

          z-index:-2147483648;

          top: 0px;

          left: 726px;

          opacity: 0.6;

}

</style>

</head>

 

 

   <body onLoad="MM_preloadImages('images/splash_logo_hover.png')"><div id="pageWrapper" class="broke-endless-pages">                       

   <div id="alertbox" class="none">

 

      

   </div>

   <div id="apDiv6">

     <div id="header">

       <!-- *** mainNav: holds the actual navigation imagery -->

       <div id="mainNav">

         <ul id="topNavLinks">

           <li class="hoverIt"><a href="http://faithinpeace.org/about.htm">About Peace</a> |

          

           </li>

           <li class="hoverIt"><a href="http://faithinpeace.org/admissions.htm" >Admissions</a> |

           

           </li>

           <li class="hoverIt"><a href="http://faithinpeace.org/academics.htm" >Academics</a> |

           

           </li>

           <li class="hoverIt"><a href="http://faithinpeace.org/rnd.htm">Research</a> |

            

           </li>

           <li class="hoverIt"><a href="http://faithinpeace.org/faculty.htm" >Our Team</a> | </li>

           <li class="hoverIt"><a href="http://faithinpeace.org/contact.htm">Contact Us</a></li>

         </ul>

       </div>

       <!-- *** mainNav div ends here*** -->

     </div>

   </div>

   </div>

      <a class="hiddenFromViewer broke-endless-pages" href="http://www.faithinpeace.org/#skippedNav">Skip navigation</a>

   <header id="globalHeader">

          <div id="globalHeaderContent">

            <nav id="globalNav"></nav>

            <span class="slides show" style="opacity: 0; "><img src="images/admissions.jpg" alt=""></span>

            <section class="searchContainer">

              <nav id="globalUtilities">

                <ol>

                  <li></li>

                </ol>

              </nav>

            </section>

            <div class="clear">

              <div id="apDiv2"><a href="http://www.faithinpeace.org" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('logo','','images/splash_logo_hover.png',1) "><img src="images/splash_logo.png" name="logo" width="397" height="190" border="0"></a></div>

            </div>

          </div>

   </header>

   <div id="apDiv7"></div>

   <div id="contentWrapper">

  <div id="content">

           <section id="gallery">

             <div class="slideControl" style="display: block; ">

                  <ul>

                     <li class="slideMarker1" id="control1">.</li>

                     <li class="slideMarker2" id="control2">.</li>

                     <li class="slideMarker3" id="control3">.</li>

                     <li class="slideMarker4" id="control4">.</li>

                     <li class="slideMarker5 slideSelected" id="control5">.</li>

                     <li id="playPause">

                        <a href="http://www.faithinpeace.org/#" id="btn-pause" style="opacity: 0.45; ">

                           <img src="./images/btn_pause.png" width="10" height="12" alt="Pause">

                        </a>

                        <a href="http://www.faithinpeace.org/#" id="btn-play" style="display: none; opacity: 0.45; ">

                           <img src="./images/btn_play.png" width="10" height="12" alt="Play">

                        </a>

                     </li>

                  </ul>

             </div>

               <section id="headlines">

                  <h1><span class="b">Peace University Initiatives</span>

                    <article id="carousel1">

                  </article></h1>

                  <ul><li><a class="thumb" href="http://www.facebook.com/pages/MAD-Media-Art-and-Design-Center-of-Excel lence/311642142252452" target="_blank" title="M.A.D"><img src="images/madtab.png" target="_blank width=" 70"="" height="70"></a>

                 <div><a href="http://www.facebook.com/pages/MAD-Media-Art-and-Design-Center-of-Excel lence/311642142252452" target="_blank" class="title">Media Arts &amp; Design</a> Promoting Media, Art and Design in every shape and form</div></li></ul>

                    <ul><li><a class="thumb" href="http://www.facebook.com/pages/YEP-Youth-Engagement-Platform-Peace/3096 23245721408" target="_blank" title="Youth Engagement Platform"><img src="./images/yep.jpg" width="70" height="70"></a>

                 <div><a href="http://www.facebook.com/pages/YEP-Youth-Engagement-Platform-Peace/3096 23245721408" target="_blank" class="title">Youth &amp; Community</a>Engaging youth in the most constructive manner</div></li></ul>

                 <ul>

                       <li><a class="thumb" href="http://faithinpeace.org/collaborate.htm" title="Collaborate"><img src="images/collaboratepetab.png" width="70" height="70"></a>

                 <div><a class="title" href="http://faithinpeace.org/collaborate.htm" title="Collaboration">Collaborate</a><a class="excerpt" href="http://faithinpeace.org/collaborate.htm">PEACE international Collaborations and exchange programs</a></div></li></ul>

             </section>

             

             

              <div class="slides show" id="slide1" style="opacity: 0; ">

                <div class="mainDarkBar"> </div>

                  <div class="mainSideBar"> </div>

                <section class="sideContent">

                     <pillarcontent><h1>We have just the right place for you</h1>

                        <p class="homeSideExcerpt01">You've read about us on our site, on our facebook page, or in our catalog (PDF). You're convinced Peace University is the right place for you and you're ready to apply. That's great!</p>

                        <p class="homeSideExcerpt01"><a href="http://www.faithinpeace.org/apply_online_peace_university/index.htm">Apply Now!</a></p>

                  </pillarcontent>

                </section>

                  <photo><img src="./images/Washington-National-Cathedral-DC.jpg">

                 </photo>

                 <div class="mainSideBar2"> </div>

             </div>

               <div class="slides" id="slide2" style="opacity: 0; ">

                 <div class="mainDarkBar"> </div>

                  <div class="mainSideBar"> </div>

                 <section class="sideContent">

                     <pillarcontent><h1>Programs and Faculty</h1>

                        <p class="homeSideExcerpt01">Learn about our Degree Programs and the incredible faculty that make it all happen.</p>

                        <ul>

                           <li>

                              <a title="Degree and Non Degree Programs" href="http://faithinpeace.org/academics.htm">More about the programs offered</a>

                              <a title="Course listings" href="http://faithinpeace.org/courses.htm">See all courses</a>

                              <a title="Faculty" href="http://faithinpeace.org/faculty.htm">Faculty</a>

                           </li>

                        </ul>

                    </pillarcontent>

                 </section>

                  <photo><img src="./images/bech-campus.jpg">

                 </photo>

                  <div class="mainSideBar2"> </div>

               </div>

               <div class="slides" id="slide3" style="opacity: 0; ">

                 <div class="mainDarkBar"> </div>

                  <div class="mainSideBar"> </div>

                 <section class="sideContent">

                     <pillarcontent><h1>Joining hands to bring about the best</h1>

                        <p class="homeSideExcerpt01">Peace international Collaborations and exchange programs have long been a productive part of research and development for the University</p>

                        <ul>

                           <li>

                              <a title="Collaborate" href="http://faithinpeace.org/collaborate.htm">Building Synergies</a>

                              <href="http: www.digital.edu"="">Partners

                           </li>

                        </ul>

                    </pillarcontent>

                 </section>

                  <photo><img src="images/Old-Post-Office-Washington-DC.jpg">

                 </photo>

                  <div class="mainSideBar2"> </div>

               </div>

               <div class="slides" id="slide4" style="opacity: 0; ">

                  <div class="mainDarkBar"> </div>

                 <div class="mainSideBar"> </div>

                  <section class="sideContent">

                     <pillarcontent><h1>Media Art and Design</h1>

                        <p class="homeSideExcerpt01">Media, Art and Design Center of Excellence (M.A.D.) is creative arm of Digital University of America promoting Media, Art and Design in every shape and form and offering programs to educate, train and build capacity.</p>

                        <ul>

                           <li>

                              <a title="Visit the face book page to see recent activity" href="http://www.facebook.com/pages/MAD-Media-Art-and-Design-Center-of-Excel lence/311642142252452" target="_blank">Visit the face book page to see recent activity</a>

                           </li>

                           <li>

                              <a title="M.A.D" href="http://www.facebook.com/pages/MAD-Media-Art-and-Design-Center-of-Excel lence/311642142252452">M.A.D</a>

                           </li>

                        </ul>

                    </pillarcontent>

                  </section>

                  <photo><img src="./images/west-virginia.jpg"  width="1239">

                 </photo>

                  <div class="mainSideBar2"> </div>

             </div>

               <div class="slides" id="slide5" style="opacity: 0; ">

                 <div class="mainDarkBar"> </div>

                  <div class="mainSideBar"> </div>

                 <section class="sideContent">

                     <pillarcontent><h1>Academics</h1>

                        <p class="homeSideExcerpt01">Peace University offers a wide range of undergraduate majors, minors and areas of concentration. We can help you sort through the wide range of options or create a customized degree program that matches your interests and goals.</p>

                        <ul>

                           <li>

                              <a title="Programs and Degrees" href="http://faithinpeace.org/academics.htm">More about Peace Degrees</a>

                              <a title="Browse our courses" href="http://faithinpeace.org/courses.htm">Browse our courses</a>

                           </li>

                        </ul>

                    </pillarcontent>

                 </section>

                  <photo><img src="./images/capitol-hill.jpg"  width="1239">

                 </photo>

                  <div class="mainSideBar2"> <span class="slides show" style="opacity: 1; "><img src="images/capitol-hill.jpg" alt=""></span></div>

              </div>

           </section>

            <div class="clear"> </div>

  </div>

   </div>

      <footer id="globalFooter" name="globalFooter">

         <section id="footerLinksContainer">

       <nav id="learnFooter" class="footerLinks">

          <h1 class="footerheadings"><a href="http://www.faithinpeace.org/admissions.htm">Admissions</a></h1>

          <div class="footerBorder">

            <ul>

              <li></li>

              <li><a href="http://www.faithinpeace.org/apply_online_peace_university" target="_blank">Apply Online</a></li>

              <li><a href="http://faithinpeace.org/financialinfo.htm" title="Tuition and Fee">Tuition and Fee</a></li>

              <li><a href="http://faithinpeace.org/aid.htm" title="Financial Aid and Scholarships">Financial Aid and Scholarships</a>

              <li><a href="http://faithinpeace.org/Peace-University-Admission-Application-Form.pd f" title="Admission" target="_blank">Admission Form</a> (PDF)</li>

              <li><a href="peace-university-catalog-2013-15.pdf" title="Catalog" target="_blank">Catalog</a><li>

</ul>

          </div>

          <h1> </h1>

       </nav>

 

 

        <nav id="liveFooter" class="footerLinks">

          <h1 class="footerheadings"><a href="http://www.faithinpeace.org/academics.htm">Academics</a></h1>

          <div class="footerBorder">

            <ul>

              <li>

                <h2>Degree</h2>

                <ul>

                  <li><a href="http://faithinpeace.org/undergraduate.htm" title="Degree Programs">Undergraduate</a></li>

                  <li><a href="http://faithinpeace.org/graduate.htm" title="Faculty &amp; Staff">Graduate</a></li>

                </ul>

              </li>

              <h2>Non Degree</h2>

              <ul>

                <li><a href="http://faithinpeace.org/nondegree.htm" title="Certificate">Certificate</a></li>

                <li><a href="http://faithinpeace.org/nondegree.htm" title="Diploma">Diploma</a></li>

                <li><a href="http://faithinpeace.org/nondegree.htm" title="Postgraduate Diploma">Postgraduate Diploma</a></li>

              </ul>

            </ul>

          </div>

          <h1> </h1>

        </nav>

 

 

 

 

        <nav id="applyFooter" class="footerLinks">

          <h1 class="footerheadings"><a href="http://www.faithinpeace.org/collaborate.htm">Initiatives</a></h1>

          <div class="footerBorder">

            <ul>

              <li><a href="http://www.facebook.com/CenterForAdvancedResearchAndDevelopment?fref=t s" title="Research &amp; Development" target="_blank">Research &amp; Development</a></li>

              <li><a href="http://www.facebook.com/pages/YEP-Youth-Engagement-Platform-Peace/3096 23245721408" title="Youth Engagement Platform" target="_blank">Youth Engagement Platform</a></li>

              <li><a href="http://www.facebook.com/pages/MAD-Media-Art-and-Design-Center-of-Excel lence/311642142252452" title="&gt;Media Arts &amp; Design" target="_blank">Media Arts &amp; Design</a></li>

            </ul>

            <h2>Partners</h2>

            <h2> </h2>

            <h2><a href="http://www.digital.edu" target="_blank" ><img src="../pu/pupagetemplate_files/dulogoteal2.png" alt="" width="111" height="43"></a></h2>

            <ul>

              <li><a href="http://digitalinternational.com/collaborate.htm" target="_blank"><img src="../pu/pupagetemplate_files/dilogoorange.png" alt="" width="111" height="43"></a></li>

            </ul>

          </div>

          <h1><br></h1>

        </nav>

 

 

        <nav id="applyFooter" class="footerLinks">

          <h1 class="footerheadings"><a href="http://www.faithinpeace.org/about.htm">About Us</a></h1>

          <div class="footerBorder">

            <ul>

              <li><a href="http://faithinpeace.org/about.htm" title="Facts &amp; Figures">Peace University</a></li>

              <li></li>

              <li></li>

              <li><a href="http://www.faithinpeace.org/faculty.htm" title="Faculty">Faculty</a></li>

              <li><a href="http://faithinpeace.org/careers.htm" title="Career and Development">Careers</a></li>

            </ul>

            <ul>

              <li><a href="http://eepurl.com/nj22f" target="_blank">Subscribe</a></li>

              <li><a href="http://www.faithinpeace.org/contact.htm" title="Contact">Contact</a></li>

            </ul>

            <ul>

              <li> </li>

              <li></li>

            </ul>

            <h2>Virtual University</h2>

            <ul>

              <li><a href="http://www.digital.edu/lms" target="_blank">Log In</a></li>

            </ul>

            <h2 class="footerh2"></h2>

          </div>

          <h1> </h1>

        </nav>

 

 

        <nav id="newsFooter" class="footerLinks">

        </nav>

<div class="clear"><!--//--></div>

           <section id="followList"> </section>

            <nav id="subFooter">

              <ul>

                <blockquote>

                  <div id="apDiv9"><img src="images/New folder/abstract.gif" width="298" height="295"></div>

                  <p> </p>

                </blockquote>

              </ul>

            </nav>

        </section>

   </footer>

</body></html>

 
Replies
  • Currently Being Moderated
    Dec 12, 2012 2:23 AM   in reply to sandyrojito

    The problem lies with the fact that you are using position absolute.

     

    An absolute positioned element is taken from the normal document flow. This means that other elements can cover the AP element without disturbing the flow of the document.

     

    This is what has happened in your case, another element is covereing the element that contains the links. The mouse detects the upper element, but not the links.

     

    Rule of thumb: DO NOT USE AP's IN A BASIC LAYOUT.

     
    |
    Mark as:
  • Currently Being Moderated
    Dec 12, 2012 7:58 AM   in reply to sandyrojito

    I'm sorry, but you are able to fix it without messing up the layout. You just need to have a better understanding of CSS and HTML. My eleven-year-old gets similarly frustrated when she can't figure out how to write a paragraph in her Language Arts class in school because what the teacher wants doesn't come naturally to her yet. But she's in school to learn and you are here to learn as well.

     

    Dump the apDiv 1 through 9.

     

    Remember that a div can contain another div.

     

    You can position divs by using margin-left, margin-top, margin-right and so on.

     

    Divs are rectangular spaces (that may expand with content) that hold stuff.

     

    One way to plan these things is to do it on a piece of paper and place divs inside of divs until you have a layout. Come up with a name for each div and make your CSS do what you're trying to do.

     

    If you are using floats, style them. Include margins and so on in classes like this (for a picture in your website):

     

    .floatLeft {

              float: left;

              margin-right: 8px;

    }

     

    .floatRight {

              float: right;

              margin-left: 8px;

    }

     

    Additionally, if you are using floats in a div, you may need to clear the floats below them, to go from, say, a two-column look to a one-column look:

     

    .clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */

              clear:both;

              height:0;

              font-size: 1px;

              line-height: 0px;

    }

     

    The HTML for a float thusly styled would be:

     

    <img src="path/image.jpg" alt="description of the picture" class="floatLeft" />

     

    If you make a div class="floatLeft", you may need to clear the float, whereupon you do this in HTML:

     

    <br class="clearfloat" />

     

    That line break will take up no room and will clear you back to a one-column situation.

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points