3 Replies Latest reply: Dec 12, 2012 7:58 AM by mhollis55 RSS

    Links on website not working

    sandyrojito Community Member

      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"><!--//--></script>

            <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-Excellence/31164214225245 2" 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-Excellence/31164214225245 2" 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/309623245721408" 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/309623245721408" 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-Excellence/31164214225245 2" 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-Excellence/31164214225245 2">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.pdf" 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=ts" title="Research &amp; Development" target="_blank">Research &amp; Development</a></li>

                    <li><a href="http://www.facebook.com/pages/YEP-Youth-Engagement-Platform-Peace/309623245721408" 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-Excellence/31164214225245 2" 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>

        • 1. Re: Links on website not working
          Ben Pleysier CommunityMVP

          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.

          • 2. Re: Links on website not working
            sandyrojito Community Member

            can you please fix the code and post it here for me, i am unable to fix it without messing up the layout...i'd really appreciate it thanks

            • 3. Re: Links on website not working
              mhollis55 CommunityMVP

              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.