treehouse : what would you like to learn today?
Web Design Web Development iOS Development

Forums

Illustration by Nick Sirotich

lightbox aligment problem

  • jbope
    Permalink to comment #
    I have a video lightbox page. When the user clicks on a thumbnail it brings up the video light box. It looks and functions correctly as a standalone page <http://www.alortho.com/wordpress/wp-content/themes/starkers/index.html&gt;

    But when I insert the same code into a prexisting Wordpress build and click on a thumbnail the video comes up below the white lightbox background. <http://www.alortho.com/wordpress/&gt;

    Feels like a positioning issue but I have tried everything I can think of and nothing fixes it so far.

    Header Code
    <link rel=\"stylesheet\" type=\"text/css\" href=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/engine/css/overlay-minimal.css\"/>
    			<script src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/engine/js/jquery.tools.min.js\"></script>
    			<script src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/engine/js/swfobject.js\"></script>
    			<script src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/engine/js/videogallery.js\"></script>
    		<style>
    			#videogallery { zoom:1; }
    			#videogallery span{ display:block; }
    			#videogallery a{
    				display:-moz-inline-stack;
    				display:inline-block;
    				zoom:1;
    				*display:inline;
    				position:relative;
    				vertical-align:top;
    				margin:3px;
    				width:160px;
    				font-family:Arial,sans-serif;
    				font-size:12px;
    				font-weight:bold;
    				text-decoration:none;
    				text-align:center;
    				opacity:0.87;
    			}
    			#videogallery a img{
    				display:block;
    				border:none;
    				margin:0;
    			}
    			#videogallery a:hover{
    				text-decoration:underline;
    				opacity:1;
    			}
    			#videogallery a#videolb{display:none}
    		</style>


    HTML Code
    <div id=\"videogallery\">
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/u79f_yWxnl8?autoplay=1\" title=\"Biceps Tendinitis\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/0.png\">Biceps Tendinitis<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/7iiUDywQnfI?autoplay=1\" title=\"Shoulder Separation: Acromioclavicular Joint\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/1.png\">Shoulder Separation: Acromioclavicular Joint<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/ZosJ2sdDIFA?autoplay=1\" title=\"AC arthritis\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/2.png\">AC arthritis<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/yzpNNSCCvUg?autoplay=1\" title=\"Shoulder: SLAP Tear\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/3.png\">Shoulder: SLAP Tear<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/u4tG5I6VkzA?autoplay=1\" title=\"Patella Dislocation\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/4.png\">Patella Dislocation<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/HhTh7lKd1Sg?autoplay=1\" title=\"Shoulder Impingement\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/5.png\">Shoulder Impingement<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/pvYaFMhp0Vc?autoplay=1\" title=\"Tennis Elbow\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/6.png\">Tennis Elbow<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/p5O8-htSCxc?autoplay=1\" title=\"Tommy John Surgery\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/7.png\">Tommy John Surgery<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/rlf3LfuwMCU?autoplay=1\" title=\"Computers in Orthopedics\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/8.png\">Computers in Orthopedics<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/ApzzGjymdr0?autoplay=1\" title=\"Surgery for Shoulder Dislocation: Bankart\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/9.png\">Surgery for Shoulder Dislocation: Bankart<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/55c2x4rdLj8?autoplay=1\" title=\"Treatment of cartilage injury\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/10.png\">Treatment of cartilage injury<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/ceSh-QrIQjs?autoplay=1\" title=\"Meniscus Tear\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/11.png\">Meniscus Tear<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/IUEfKBtROAY?autoplay=1\" title=\"ACL injury\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/12.png\">ACL injury<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/qfBp2nfCg3Y?autoplay=1\" title=\"Cartilage injuries of the knee\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/13.png\">Cartilage injuries of the knee<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/0Kx-2NMdGMU?autoplay=1\" title=\"Hip Impingement\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/14.png\">Hip Impingement<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/3ndu-1YnMBA?autoplay=1\" title=\"Arthroscopy\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/15.png\">Arthroscopy<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/pSPROrxz7F0?autoplay=1\" title=\"ACL Treatment\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/16.png\">ACL Treatment<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/JnHQ5IPVpB4?autoplay=1\" title=\"Meniscus Tears\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/17.png\">Meniscus Tears<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/4rkPumsMDls?autoplay=1\" title=\"Shoulder Dislocation\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/18.png\">Shoulder Dislocation<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/HzscU624QFU?autoplay=1\" title=\"Rotator Cuff Repair\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/19.png\">Rotator Cuff Repair<span></span></a>
    			<a rel=\"#voverlay\" href=\"http://www.youtube.com/v/KUVqMElGXxM?autoplay=1\" title=\"Achilles Tendon Injury\"><img src=\"http://www.alortho.com/wordpress/wp-content/themes/starkers/data/thumbnails/20.png\">Achilles Tendon Injury<span></span></a><a id=\"videolb\" href=\"http://videolightbox.com\">Add Flash Video To Web by VideoLightBox.com v1.3m</a></div>
Add a Comment