Jump to content

HDRebel88

Members
  • Posts

    26
  • Joined

  • Last visited

Posts posted by HDRebel88

  1. The below makes it so I can scroll vertically, but horizontally still gets clipped:

    article, aside, figure, footer, header, hgroup, main, menu, nav, section{display: block;}
    body{
    padding: 0;
    margin: 0 auto;
    text-align: center;
    background-color: #dcdcdc;
    min-width: 1000px;
    }
    #wrapper
    {
    top: 50%;
    left: 50%;
    margin-top: -333px;
    marginleft: -480px;
    position: absolute;
    }
    #bgImage
    {
    min-width: 960px;
    min-height: 667px;
    width: 100%;
    height: 100%;
    background: url("http://www.tinasguitar.com/bg.jpg") no-repeat;
    }
    #socialBar
    {
    position: absolute;
    top: 80px;
    left: 100px;
    }
    #socialBar img
    {
    width: 33px;
    height: 33px;
    background-image: url("http://www.tinasguitar.com/social.png"); 
    background-repeat: no-repeat;
    margin-left: 10px;
    }
    #twitter
    {
    background-position: -34px 0px;
    }
    #fb
    {
    background-position: -102px 0px;
    }
    #yt
    {
    background-position: -68px 0px;
    }
    #gp
    {
    background-position: 0px 0px;
    }
    

    The issue is I don't want it to resize the image, I want to force a hard minimum size of the body of the page so when the window is shrunk down the browsers minimum width is the width of the picture (if the window is smaller than the minimum width, then the window should be scrollable to access all portions of the image). This is because I am absolutely positioning another image over it that needs to stay in that exact location and the same size.

     

    I'm beginning to suspect this isn't possible. Not really surprising, seems the "powers that be" of HTML and CSS are making the language more and more difficult to accomplish what you want to with every subsequent revision. As soon as I hear "you can't do that", I think "flaw in the design of the system".

     

     

    I may just have to not vertically center (still don't understand why there isn't a simple verticle-align css rule to vertically center something within a page or within a containing element. This bullshit work around crap couldn't be any more irritating; especially since it never works. 

  2. I have a vertically and horizontally centered image within a window. The layout as is perfect. The only issue is that when the window is resized, the image is clipped by the browser window. I wanted the image to remain 100% within the scroll bars of the window, so the page can be scrolled, so you can access any part of the image with the scroll bars.

     

    Development URL: http://www.tinasguitar.com/develop/

    (Resize the window and you'll see what I mean.

     

    CSS and HTML follow:

    article, aside, figure, footer, header, hgroup, main, menu, nav, section{display: block;}
    body{
    padding: 0;
    margin: 0;
    margin: 0 auto;
    text-align: center;
    background-color: #dcdcdc;
    }
    #wrapper
    {
    top: 50%;
    left: 50%;
    margin-top: -333px; /* Half the height */
    ; /* Half the width */
    position: absolute;
    }
    #bgImage
    {
    width: 960px;
    height: 667px;
    background: url("http://www.tinasguitar.com/bg.jpg");
    }
    #socialBar
    {
    position: absolute;
    top: 80px;
    left: 100px;
    }
    #socialBar img
    {
    width: 33px;
    height: 33px;
    background-image: url("http://www.tinasguitar.com/social.png"); 
    background-repeat: no-repeat;
    margin-left: 10px;
    }
    #twitter
    {
    background-position: -34px 0px;
    }
    #fb
    {
    background-position: -102px 0px;
    }
    #yt
    {
    background-position: -68px 0px;
    }
    #gp
    {
    background-position: 0px 0px;
    }
    
    <!DOCTYPE html>
    <html lang="en-US"> 
    <head>
    <base href="http://www.tinasguitar.com/" />
    <title>Tina S.</title>
    <meta charset="utf-8" />
    <meta content="" name="keywords" />
    <meta content="" name="description" />
    <meta content="index, follow" name="robots" />
    <link href="/develop/style.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
    	<section id="wrapper">
    		<img src="transparent.png" id="bgImage" name="bgImage" usemap="#vigierguitars">
    		<div id="note">This is an unofficial fan site that links to Tina's official social networking pages. The owner of this site has no affiliation with Tina.</div>
    		<div id="socialBar">
    			<a href="https://twitter.com/Tina_S__"><img alt="Twitter" id="twitter" name="twitter" src="transparent.png" title="Twitter" /></a>
    			<a href="https://www.facebook.com/pages/Tina-S/181555232026760"><img alt="FaceBook" id="fb" name="fb" src="transparent.png" title="FaceBook" /></a>
    			<a href="https://plus.google.com/+TinaS"><img alt="Google+" id="gp" name="gp" src="transparent.png" title="Google+" /></a>
    			<a href="https://www.youtube.com/user/malabar777"><img alt="YouTube" id="yt" name="yt" src="transparent.png" title="YouTube" /></a>
    		</div>
    	</section>
    	<map name="vigierguitars">
    	<area shape="rect" coords="700,520,865,620" href="http://www.vigierguitars.com/" alt="Vigier Guitars" target="_blank">
    </body>
    </html>
    

    Basically I need to some how create a hard border that the browser window observes as the definitive borders of the page, so the browser window can't clip off portions of the image.

  3. You want a fixed footer but you're using position: absolute; .. that's your issue.

     

    No I don't. A fixed footer would stay at the bottom of the window regardless of where you scroll on the page. (For example, Facebook and Twitter's headers are fixed elements. Not what I want for my footer.)

     

    I want a footer that is at the bottom of the document, only visible when you scroll to it, unless the document is shorter than the window height, then the footer should be stuck to the bottom of the window.

  4. I am trying to implement a sticky footer on my site, but I cannot get it to work. I've done it on about 5 sites prior to this, but this one is just not working.

     

    The footer sticks to the bottom of the window, not the bottom of the document. I need it to be the bottom of the document.

     

    This is the current state of the page: http://www.aspyrhosting.com/index.php

     

    HTML:

    <!DOCTYPE html>
    <html lang="en-US"> 
    <head>
    <title></title>
    <meta charset="utf-8" />
    <meta content="index, follow" name="robots" />
    <meta content="0.0.1" name="revision" />
    <link href="http://cdn2.aspyr.us/imgs/aspyrhosting/favicon.ico?v=0.0.1" rel="shortcut icon" />
    <link href="http://cdn2.aspyr.us/css/aspyrhosting/style.css?v=0.0.1" rel="stylesheet" type="text/css" />
    </head>
    <body>
    <div id="container">
    	<header role="banner">
    		<section id="wrapper">
    			<div id="logoWrapper">
    			<img id="logo" src="./transparent.png?v=0.0.1" />
    			</div>
    			<div id="headerRight"></div>
    		</section>
    		<section id="menuWrapper">
    			<div id="menuInnerWrapper">
    				<div id="menu">
    								</div>
    			</div>
    			<div id="searchbox">
    			Search: <input type="text" />
    			</div>
    		</section>
    	</header>
    	<main id="content" role="main">
    				<p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p>
    	</main>
    	<footer>
    		<section id="left">
    			<div id="copyright" role="copyright"></div>
    		</section>
    		<section id="right">
    					</section>
    			</footer>
    </div>
    </body>
    </html>
    

    CSS:

    article, aside, figure, footer, header, hgroup, main, menu, nav, section{display: block;}
    html,body
    {
    margin:0;
    padding:0;
    height:100%;	
    }
    
    #container
    {
    height:100%;
    min-height:100%;
    min-width: 1115px;
    position:relative;
    }
    
    header 
    {
    
    }
    #logo
    {
    background: url('http://cdn2.aspyr.us/imgs/aspyrhosting/logo.png');	
    }
    
    main
    {
    padding-bottom: 100px;   /* Height of the footer */
    }
    
    footer
    {
    position:absolute;
    bottom:0;
    width:100%;
    height: 100px;   /* Height of the footer */
    background:#39f;
    }
    
    #menuWrapper
    {
    background: #080000;
    clear: both;
    width: 100%;
    height: 40px;
    }
    
    #menuInnerWrapper
    {
    float: left;
    width: 850px;
    }
    
    #menu
    {
    margin: 0 auto;
    width: 710px;
    }
    
    ul{
    padding: 0 3px;
    margin: 0 auto;
    list-style-type: none;
    display: block;
    float: left;
    }
    
    ul li{
    display: inline-block;
    padding: 0 5px;
    margin: 0 auto;
    text-align: center;
    height: 40px;
    width: 90px;
    line-height: 40px;
    }
    
    ul li a
    {
    text-decoration: none;
    color: #fff;
    }
    
    #searchbox
    {
    float: right;
    line-height: 40px;
    padding-right: 10px;
    min-width: 200px;
    width: 10%;
    }
    
  5. Need some help finding out why this is returning a null result set:

     

    The below code is giving me a result set of an integer set to "0" (the id), a "word"and "def" both set to NULL. It's failing at my "Error #2" point. var_dumps on $id, $word, and $def all give the null output. Each $category is being shown when I var_dump($category).

     

    I know this shouldn't be the case because when I run this straight in PHPMyAdmin I get a non-null result set.

     

    (Not sure why my indentation is not carrying over to the forum. Sorry about that.)

    <?php
    session_start();
    if(!isset($_SESSION['loopcatch']) || $_SESSION['loopcatch']==null || !is_int($_SESSION['loopcatch'])){
    $_SESSION['loopcatch']=0;
    }
    if($_SESSION['loopCatch'] > 1){
    //Email error
    die();
    }
    require 'dbConnect.php';
    $categories=array('business', 'music', 'film', 'drum');
    //Pull Quotes
    //Query to Pull random quote
    $mainQuery="SELECT `r1`.`id`, `r1`.`word`, `r1`.`def` FROM `dictionary` AS `r1` JOIN (SELECT (RAND() * (SELECT MAX(`id`) FROM `dictionary`)) AS `id`) AS `r2` WHERE `r1`.`id` >= `r2`.`id` AND `category`=? AND `checked`=0 ORDER BY `r1`.`id` ASC LIMIT 1";
    //prepare quotes query
    if($prepareQuote=mysqli_prepare($conn, $mainQuery)){
    //filter through each category
    foreach($categories as $category){
    //Bind the variable to the quotes query
    mysqli_stmt_bind_param($prepareQuote, "s", $category);
    //execute quotes statement
    mysqli_stmt_execute($prepareQuote);
    //Store quotes result set
    mysqli_stmt_store_result($prepareQuote);
    //Check how many rows are returned
    if(mysqli_stmt_num_rows($prepareQuote) > 0){
    //Bind results to variables
    mysqli_stmt_bind_result($prepareQuote, $id, $word, $def);
    //If $id, $word, or $def is null abort and email error
    if(!is_null($id) && is_numeric($id) && !is_null($word) && !is_null($def)){
    while($row=mysqli_stmt_fetch($prepareQuote)){
    mysqli_autocommit($conn, FALSE);
    //Input into second table
    $updateQuery="UPDATE `quotes` SET `word`=?, `def`=? WHERE `category`=?";
    //prepare insert query
    if($updateQuote=mysqli_prepare($conn, $updateQuery)){
    //Bind the variables to the insert query
    mysqli_stmt_bind_param($updateQuote, "sss", $word, $def, $category);
    //execute insert statement
    mysqli_stmt_execute($updateQuote);
    //Store insert quote result set
    mysqli_stmt_store_result($updateQuote);
    //Check how many rows are returned on insert quote query
    if(mysqli_stmt_affected_rows($updateQuote) > 0){
    //If query run sucessfully insert and update; if not rollback.
    //mark quote checked
    $checkedQuery="UPDATE `dictionary` SET `checked`=1 WHERE `id`=?";
    //prepare checked query
    if($checkedQuote=mysqli_prepare($conn, $checkedQuery)){
    mysqli_stmt_bind_param($checkedQuote, "i", $id);
    //execute checked statement
    mysqli_stmt_execute($checkedQuote);
    //Store checked quote result set
    mysqli_stmt_store_result($checkedQuote);
    //Check how many rows are returned on checked quote query
    if(mysqli_stmt_affected_rows($checkedQuote > 0)){
    mysqli_commit($conn);
    }
    else{
    echo 'Error #6 ';
    mysqli_rollback($conn);
    }
    }
    else{
    echo 'Error #5';
    //Email error
    die();
    }
    }
    else{
    echo 'Error #4';
    mysqli_rollback($conn);
    }
    }
    else{
    echo 'Error #3';
    //Email error
    die();
    }
    }
    }
    else{
    echo 'Error #2';
    //Query returned blank result set - Email Error
    }
    }
    else{
    //If zero rows returned, uncheck rows in table for that specific category and re-run the query.
    $uncheckQuery="UPDATE `dictionary` SET `checked`=0 WHERE `category`=?";
    if($uncheckQuotes=mysqli_prepare($conn, $uncheckQuery)){
    //Bind the variable to the query
    mysqli_stmt_bind_param($uncheckQuotes, "s", $category);
    //execute statement
    mysqli_stmt_execute($uncheckQuotes);
    //Store result set
    mysqli_stmt_store_result($uncheckQuotes);
    //Check how many rows are returned
    if(mysqli_stmt_affected_rows($uncheckQuotes) > 0){
    $_SESSION['loopCatch']++;
    header("Location: ./pullDailyQuotes.php");
    }
    else{
    //Email error
    }
    }
    }
    }
    }
    else{
    //Email error
    echo 'Error #1';
    die();
    }
    ?>
    
  6. I need some help working out this MySQL query:

     

    I need it to pull a random quote, that hasn't been used before (that's the 'checked' part of the query), and it needs to find it based on a specific category. I am using this alongside PHP with MySQLI Prepared method.

     

     

    SELECT `id`, `word`, `def` FROM `dictionary` AS `r1` JOIN (SELECT (RAND() * (SELECT MAX(`id`) FROM `dictionary`)) AS `id`) AS `r2` WHERE `r1`.`id` >= `r2`.`id` AND `category`=? AND `checked`=0 ORDER BY `r1`.`id` ASC LIMIT 1
    

     

    This query yields an error stating that the id column is ambiguous. 

  7. I'm trying to make a navigation bar that when a link it is clicked the page is scrolled to the corresponding section and the link is underlined. I also need it to underline the corresponding link when the page is manually scrolled to that section of the page.

     

     

    Here's the jQuery I'm using:



    $(document).ready(function(){
     
    /**
         * This part causes smooth scrolling using scrollto.js
         * We target all a tags inside the nav, and apply the scrollto.js to it.
         */
        $("#menuItems a").click(function(evn){
            evn.preventDefault();
            $('html,body').scrollTo(this.hash, this.hash); 
        });
     
        /**
         * This part handles the highlighting functionality.
         * We use the scroll functionality again, some array creation and 
         * manipulation, class adding and class removing, and conditional testing
         */
        var aChildren = $("#menuItems a").children(); // find the a children of the list items
        var aArray = []; // create the empty aArray
        for (var i=0; i < aChildren.length; i++) {    
            var aChild = aChildren[i];
            var ahref = $(aChild).attr('href');
            aArray.push(ahref);
        } // this for loop fills the aArray with attribute href values
     
        $(window).scroll(function(){
            var windowPos = $(window).scrollTop(); // get the offset of the window from the top of page
            var windowHeight = $(window).height(); // get the height of the window
            var docHeight = $(document).height();
     
            for (var i=0; i < aArray.length; i++) {
                var theID = aArray[i];
                var divPos = $(theID).offset().top; // get the offset of the div from the top of page
                var divHeight = $(theID).height(); // get the height of the div in question
                if (windowPos >= divPos && windowPos < (divPos + divHeight)) {
                    $("a[href='" + theID + "']").addClass("menuItem-active");
                } else {
                    $("a[href='" + theID + "']").removeClass("menuItem-active");
                }
            }
     
            if(windowPos + windowHeight == docHeight) {
                if (!$("#menuItems:last-child a").hasClass("menuItem-active")) {
                    var navActiveCurrent = $(".menuItem-active").attr("href");
                    $("a[href='" + navActiveCurrent + "']").removeClass("menuItem-active");
                    $("#menuItems:last-child a").addClass("menuItem-active");
                }
            }
        });
    });
     
    }


     

    Here's my HTML:

     



    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" id="summary"> 
    <head>
    <title>Hydralus Presentation</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta name="keywords" content="">
    <meta name="description" content="" />
    <meta name="author" content="Andrew McCarrick" />
    <meta name="robots" content="index, follow" />
    <link rel="stylesheet" type="text/css" href="./pres_style.css" />
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="./jquery-2.1.0.min.js"><\/script>')</script>
    <script src="./jquery.scrollTo.min.js"></script>
    <script src="./scroll.js"></script>
    </head>
    <body>
    <div id="wrapper">
    <div id="menu">
    <div id="logo">
    <a href="./"><img src="./logo.png" /></a>
    </div>
    <div id="menuItems">
    <div class="menuItem"><a href="pres_index.html#summary">Project Summary/Pitch</a></div>
    <div class="menuItem"><a href="pres_index.html#budget">Project Budget</a></div>
    <div class="menuItem"><a href="pres_index.html#wireframe">Wireframe</a></div>
    <div class="menuItem"><a href="pres_index.html#website">Website</a></div>
    </div>
    </div>
    <div id="contentPadder"></div>
    <div id="content">
    <div id="summaryWrapper">
    Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test vvv
    </div>
    <a id="budget"></a>
    <div>
    Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 
    </div>
    <a id="wireframe"></a>
    <div>
    Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 
    </div>
    <a id="website"></a>
    <div>
    Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 
    </div>
    </div>
    </div>
    </body>
    </html>


     

     

    And here's the relevant CSS code:



    #menuItems{
    float: left;
    text-align: center;
    width: 65%;
    min-width: 650px;
    overflow: auto;
    }
     
    .menuItem{
    display: inline-block;
    line-height: 120px;
    padding: 0 25px;
    font-size: 20px;
    font-family: Verdana;
    margin: 0 auto;
    }
    .menuItem a{
    color: #FFFFFF;
    text-decoration: none;
    }
    .menuItem-active, .menuItem a:hover{
    text-decoration: underline;
    }
     


  8. I'm trying to get a box-shadow to be applied to all sides but the top.

    Here's the page:

    http://www.hydralus.com/index.php

    The area in question is the div with the red box-shadow. I want to get rid of the top shadow and keep the left, right, and bottom exactly the way they are. I essentially want that protruding box to merge into the top black box. 

    I've already tried z-index to force the smaller box behind the bigger one, but no dice.

    I'm basically trying to mimic the navigation look of this site: http://www.advancedlumonics.com/

    HTML/PHP

    <?php
    header('X-UA-Compatible: IE=edge');
    require 'pages.php';
    ?>
    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
    <head>
    <base href="//www.hydralus.com" />
    <title>Hydralus</title>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="verify-v1" content="" />
    <meta name="keywords" content=""  />
    <meta name="description" content="" />
    <meta name="author" content="Hydralus, Andrew McCarrick, Raphael Ades-Aron, Nana Kvaratskheliya, Latisha Lewis" />
    <meta name="robots" content="index, follow" />
    <link rel="stylesheet" href="style.css" media="screen" />
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="//hydral.us/jquery/2.1.0.min.js"><\/script>')</script>
    </head>
    <body>
    <div id="wrapper">
    <div id="head">
    <div id="innerHeader">
    <div id="logo">
    Logo
    </div>
    <div id="navbar">
    Navigation Bar
    </div>
    <div id="top">
    ||
    </div>
    </div>
    </div>
    
    <div id="contentWrapper">
    <div id="content">
    <?php echo $content; ?>
    Content
    </div>
    </div>
    
    <div id="footerWrapper">
    <div id="footer">
    Footer
    </div>
    </div>
    
    </div>
    </body>
    </html>
    

    CSS:

    html,body {
    margin:0;
    padding:0;
    height:100%;
    background-color: #F4F4F4;
    }
    
    #wrapper{
    min-height:100%;
    position:relative;
    }
    
    #head{
    height: 140px;
    border: 0;
    background-color: #080808;
    box-shadow: 0px 3px 4px #828282;
    }
    
    #innerHeader{
    width: 1000px;
    margin: 0 auto;
    text-align: center;
    padding-top: 10px;
    color: #FFFFFF;
    }
    
    #logo{
    height: 70px;
    }
    
    #navbar{
    height: 40px;
    }
    
    #top{
    width: 48px;
    height: 24px;
    position: relative;
    top: 17px;
    background-color: #080808;
    margin: 0 auto;
    box-shadow: 0 0 3px 4px #FF0000;
    overflow: hidden;
    }
    
    #contentWrapper{
    padding-bottom: 65px;
    }
    
    #content{
    padding: 5px;
    min-height: 500px;
    }
    
    #footerWrapper{
    height: 60px;
    position: absolute;
    bottom: 0;
    width: 100%;
    }
    
  9. I'm trying to run a check via jQuery/AJAX to see if the user loading the page has Javascript turned on... if they do I need to reload the page, after setting a session variable in PHP so I can activate javascript based controls that I need to have turned off if the user doesn't have javascript turned on. The controls turned off is the default...

     

    Here's my AJAX call:

    $(document).ready(function(){
    $.ajax({ url: "jscheck.php",
            context: document.body,
            success: function(data){
                if (data=='yes')
                {
                window.location = '/films/'+filmTitle;
                }
                else
                { }
            }});
    });
    
    Here's my php:

    <?php
    session_start();
    $_SESSION['jsCheck']="yes";
    echo $_SESSION['jsCheck'];
    ?>
    
    This works but the page just keeps looping and looping.
  10. Alright, I'm 99% sure I just got it... Will test momentarily, then confirm.

     

     

    $rowNum=1;  
    $cellNum=0;  
    $amountOfStaffReturned=mysqli_num_rows($staffQuery);  
                if($amountOfStaffReturned>0){
                $departmentHeader=false;  
                $content.='<div class="emailHeader">Staff Contacts</div>';  
                    while($staff=mysqli_fetch_array($staffQuery, MYSQLI_ASSOC)){ 
                    $staffName=$staff['name']; $staffEmail=$staff['email']; $staffDepartment=$staff['department']; $staffPosition=$staff['position'];  
                    $rowName=rowName($rowNum);  
                        if($rowNum>1){$rowEmailClassAdd=' emailRow';}else{$rowEmailClassAdd='';}
     
    if($departmentHeader!=$staffDepartment){
    if($cellNum%2!=0){
    $content.='<div class="emailCell"> </div>';
    $cellNum++;
    }
    if($departmentHeader!=false){
    $content.='</div>';
    }
    $departmentHeader=$staffDepartment;
    $content.='<div class="departmentHeader">'.$staffDepartment.'</div>';
    }
    else{if($cellNum%2==0){$content.='</div>';}}
    if($cellNum%2==0){
    $content.='<div class="overflowclear'.$rowEmailClassAdd.'" id="emailStaff'.ucfirst($rowName).'Row">';
    $rowNum++; 
    }
    $content.='  
    <div class="emailCell">  
    <div class="emailTitle">'.$staffName.'</div>  
    <div class="emailSubTitle">'.$staffPosition.'</div>  
    <div><a class="contactemail" href="mailto:'.$staffEmail.'">'.escapeemail($staffEmail).'</a></div>  
    </div>';
    $cellNum++;
    }
    $content.='</div>';               
                }
    

     

    Thanks for the help guys, certainly lead me to the right path. 

  11. Okay did that, and it's still not quite right (although it is very very close; visually it's right, HTML code-wise its not):
     
    (Sorry about the indentations, the forum software is screwing it up)
     

    $rowNum=1;  
    $cellNum=0;  
    $amountOfStaffReturned=mysqli_num_rows($staffQuery);  
    if($amountOfStaffReturned>0){
    $departmentHeader=false;  
    $content.='<div class="emailHeader">Staff Contacts</div>';  
    while($staff=mysqli_fetch_array($staffQuery, MYSQLI_ASSOC)){ 
    $staffName=$staff['name']; $staffEmail=$staff['email']; $staffDepartment=$staff['department']; $staffPosition=$staff['position'];  
    $rowName=rowName($rowNum);  
    if($rowNum>1){$rowEmailClassAdd=' emailRow';}else{$rowEmailClassAdd='';}
     
    if($departmentHeader!=$staffDepartment){
    if($departmentHeader!=false){
    $content.='</div>';
    }
    $departmentHeader=$staffDepartment;
    $content.='<div class="departmentHeader">'.$staffDepartment.'</div>';
    $content.='<div class="overflowclear'.$rowEmailClassAdd.'" id="emailStaff'.ucfirst($rowName).'Row">';
    $rowNum++; 
    }
    $content.='  
    <div class="emailCell">  
    <div class="emailTitle">'.$staffName.'</div>  
    <div class="emailSubTitle">'.$staffPosition.'</div>  
    <div><a class="contactemail" href="mailto:'.$staffEmail.'">'.escapeemail($staffEmail).'</a></div>  
    </div>';
    $cellNum++;
    }
    $content.='</div>';               
    }
    

     
     
    This results in this HTML code:
     

    <div class="emailHeader">Staff Contacts</div>
    <div class="departmentHeader">Assistants</div>
    <div class="overflowclear" id="emailStaffOneRow">  
    <div class="emailCell">  
    <div class="emailTitle">Diane Bosch</div>  
    <div class="emailSubTitle">Assistant to Haylie and Kaylie James</div>  
    <div><a class="contactemail" href="mailto:DBosch@kamentertainment.net">DBosch@kamentertainment.net</a></div>  
    </div>  
    <div class="emailCell">
    <div class="emailTitle">Lily Scorfield</div>  
    <div class="emailSubTitle">Assistant to Andrew McCarrick</div>  
    <div><a class="contactemail" href="mailto:LScorfield@kamentertainment.net">LScorfield@kamentertainment.net</a></div>  
    </div>
    ---Missing closing DIV for first row---
    ---Missing opening div for second row---
    <div class="emailCell">  
    <div class="emailTitle">Roka Kino</div>  
    <div class="emailSubTitle">Assistant to Madison Acres</div>  
    <div><a class="contactemail" href="mailto:RKino@kamentertainment.net">RKino@kamentertainment.net</a></div>  
    </div>
    ---Missing empty cell code of <div class="emailCell"> </div>---
    </div>
     
    <div class="departmentHeader">Information Technology</div>
    <div class="overflowclear emailRow" id="emailStaffTwoRow"><--- Should be called emailStaffThreeRow
    <div class="emailCell">  
    <div class="emailTitle">Dennis O'neal</div>  
    <div class="emailSubTitle">Web Design</div>  
    <div><a class="contactemail" href="mailto:DOneal@kamentertainment.net">DOneal@kamentertainment.net</a></div>  
    </div>  
    <div class="emailCell">  
    <div class="emailTitle">Eiki Akimoto</div>  
    <div class="emailSubTitle">EVP of Information Technology</div>  
    <div><a class="contactemail" href="mailto:EAkimoto@kamentertainment.net">EAkimoto@kamentertainment.net</a></div>  
    </div>
    ---Missing closing DIV for third row---
    ---Missing opening div for fourth row---
    <div class="emailCell">  
    <div class="emailTitle">Martin Evanson</div>  
    <div class="emailSubTitle">Web Development</div>  
    <div><a class="contactemail" href="mailto:MEvanson@kamentertainment.net">MEvanson@kamentertainment.net</a></div>  
    </div>
    ---Missing empty cell code of <div class="emailCell"> </div>---
    </div>
    
  12.  

    Looks like you may have figured out your problem....

     

    Nope... just ditched using PHP and MySQL and coded it straight in HTML:

    $content.='<div id="contactusWrapper">
    <div class="header">Contact Us</div>
    <a name="submissionspolicy"></a>
    <div class="overflowclear" id="contactusGeneralContainer">
    <div class="emailHeader">General Contact</div>
    <div class="overflowclear center" id="emailGeneralFirstRow">
    <div class="emailCell">
    <div><span class="bold">Company E-Mail</span><br /><a class="contactemail" href="mailto:'.$email.'">'.$emailEscaped.'</a></div>
    </div>
    <div class="emailCell">
    <div><span class="bold">US Phone</span> <br />'.$phone.'</div>
    </div>
    </div>
    </div>
    <div class="overflowclear" id="submissionsPolicy">
    <div class="emailHeader">Submissions Policy</div>
    <div id="submissionsText">Currently we do not accept unsolicited submissions.<br/><span class="fourteen">If you choose to send us any material, it will NOT be read and will be immediately destroyed (if in physical form) or deleted (if sent via email). <br /> No material will be returned to you.</span><br />
    <div class="submissionNote">Please note, if you choose to disregard this policy and submit materials regardless, you acknowledge that you have read the submission policy and understand that by making such a submission, you understand that KAM Entertainment has no obligation to you or your submission and that you have no claim whatsoever based on such submission.</div></div> 
    </div>
    <div class="overflowclear" id="contactusExecContainer">
    <div class="emailHeader">Executive Contacts</div>
    <div class="overflowclear" id="emailExecFirstRow">
    <div class="emailCell">
    <div class="emailTitle">Andrew McCarrick</div>
    <div class="emailSubTitle">C.E.O./President/Founder</div>
    <div><a class="contactemail" href="mailto:AMcCarrick@kamentertainment.net">AMcCarrick@kamentertainment.net</a></div>
    </div>
    <div class="emailCell">
    <div class="emailTitle">Madison Acres</div>
    <div class="emailSubTitle">C.O.O./V.P. of Development/Co-Founder</div>
    <div><a class="contactemail" href="mailto:MAcres@kamentertainment.net">MAcres@kamentertainment.net</a></div>
    </div>
    </div>
    <div class="emailRow overflowclear" id="emailExecSecondRow">
    <div class="emailCell">
    <div class="emailTitle">Kaylie James</div>
    <div class="emailSubTitle">C.M.O./V.P. of Marketing/Co-Founder</div>
    <div><a class="contactemail" href="mailto:KJames@kamentertainment.net">KJames@kamentertainment.net</a></div>
    </div>
    <div class="emailCell">
    <div class="emailTitle">Haylie James</div>
    <div class="emailSubTitle">C.F.O./C.S.O./V.P. of Distribution</div>
    <div><a class="contactemail" href="mailto:HJames@kamentertainment.net">HJames@kamentertainment.net</a></div>
    </div>
    </div>
    </div>
    
    <div class="overflowclear" id="contactusStaffContainer"><div class="emailHeader">Staff Contacts</div>
    <div class="departmentHeader">Assistants</div>
    <div class="overflowclear" id="emailStaffOneRow">
    <div class="emailCell">
    <div class="emailTitle">Diane Bosch</div>
    <div class="emailSubTitle">Assistant to Haylie and Kaylie James</div>
    <div><a class="contactemail" href="mailto:DBosch@kamentertainment.net">DBosch@kamentertainment.net</a></div>
    </div>
    <div class="emailCell">
    <div class="emailTitle">Lily Scorfield</div>
    <div class="emailSubTitle">Assistant to Andrew McCarrick</div>
    <div><a class="contactemail" href="mailto:LScorfield@kamentertainment.net">LScorfield@kamentertainment.net</a></div>
    </div>
    </div>
    <div class="overflowclear emailRow" id="emailStaffTwoRow">
    <div class="emailCell">
    <div class="emailTitle">Roka Kino</div>
    <div class="emailSubTitle">Assistant to Madison Acres</div>
    <div><a class="contactemail" href="mailto:RKino@kamentertainment.net">RKino@kamentertainment.net</a></div>
    </div>
    <div class="emailCell">
     
    </div>
    </div>
    <div class="departmentHeader">Information Technology</div>
    <div class="overflowclear emailRow" id="emailStaffThreeRow">
    <div class="emailCell">
    <div class="emailTitle">Eiki Akimoto</div>
    <div class="emailSubTitle">EVP of Information Technology</div>
    <div><a class="contactemail" href="mailto:EAkimoto@kamentertainment.net">EAkimoto@kamentertainment.net</a></div>
    </div>
    <div class="emailCell">
    <div class="emailTitle">Dennis O\'neal</div>
    <div class="emailSubTitle">Web Design</div>
    <div><a class="contactemail" href="mailto:DOneal@kamentertainment.net">DOneal@kamentertainment.net</a></div>
    </div>
    </div>
    <div class="overflowclear emailRow" id="emailStaffFourRow">
    <div class="emailCell">
    <div class="emailTitle">Martin Evanson</div>
    <div class="emailSubTitle">Web Development</div>
    <div><a class="contactemail" href="mailto:MEvanson@kamentertainment.net">MEvanson@kamentertainment.net</a></div>
    </div>
    <div class="emailCell">
     
    </div>
    </div>
    <div class="departmentHeader">Marketing</div>
    <div class="overflowclear emailRow" id="emailStaffFiveRow">
    <div class="emailCell">
    <div class="emailTitle">Kristal York</div>
    <div class="emailSubTitle">EVP of Marketing</div>
    <div><a class="contactemail" href="mailto:KYork@kamentertainment.net">KYork@kamentertainment.net</a></div>
    </div>
    <div class="emailCell">
    <div class="emailTitle">Aron Patterson</div>
    <div class="emailSubTitle">Marketing Manager & SVP of PR</div>
    <div><a class="contactemail" href="mailto:APatterson@kamentertainment.net">APatterson@kamentertainment.net</a></div>
    </div>
    </div>
    <div class="overflowclear emailRow" id="emailStaffSixRow">
    <div class="emailCell">
    <div class="emailTitle">Isabella Morris</div>
    <div class="emailSubTitle">Digital Marketing & SVP of Web Design</div>
    <div><a class="contactemail" href="mailto:IMorris@kamentertainment.net">IMorris@kamentertainment.net</a></div>
    </div>
    <div class="emailCell">
    <div class="emailTitle">Sienna Bibi</div>
    <div class="emailSubTitle">Graphics Design</div>
    <div><a class="contactemail" href="mailto:SBibi@kamentertainment.net">SBibi@kamentertainment.net</a></div>
    </div>
    </div>
    <div class="departmentHeader">Operations</div>
    <div class="overflowclear emailRow" id="emailStaffSevenRow">
    <div class="emailCell">
    <div class="emailTitle">Maddison Beringer</div>
    <div class="emailSubTitle">EVP of Business Development</div>
    <div><a class="contactemail" href="mailto:MBeringer@kamentertainment.net">MBeringer@kamentertainment.net</a></div>
    </div>
    <div class="emailCell">
    <div class="emailTitle">Rafael Kramer</div>
    <div class="emailSubTitle">EVP Business & Legal Affairs</div>
    <div><a class="contactemail" href="mailto:RKramer@kamentertainment.net">RKramer@kamentertainment.net</a></div>
    </div>
    </div>
    <div class="overflowclear emailRow" id="emailStaffEightRow">
    <div class="emailCell">
    <div class="emailTitle">Stephanie Badham</div>
    <div class="emailSubTitle">Business Development</div>
    <div><a class="contactemail" href="mailto:SBadham@kamentertainment.net">SBadham@kamentertainment.net</a></div>
    </div>
    <div class="emailCell">
    <div class="emailTitle">Katheryne Mayer</div>
    <div class="emailSubTitle">Business & Legal Affairs</div>
    <div><a class="contactemail" href="mailto:KMayer@kamentertainment.net">KMayer@kamentertainment.net</a></div>
    </div>
    </div>
    <div class="departmentHeader">Post-Production</div>
    <div class="overflowclear emailRow" id="emailStaffNineRow">
    <div class="emailCell">
    <div class="emailTitle">Lilian Tyrell</div>
    <div class="emailSubTitle">EVP of Post-Production</div>
    <div><a class="contactemail" href="mailto:LTyrell@kamentertainment.net">LTyrell@kamentertainment.net</a></div>
    </div>
    <div class="emailCell">
    <div class="emailTitle">Jerome Black</div>
    <div class="emailSubTitle">Editor</div>
    <div><a class="contactemail" href="mailto:JBlack@kamentertainment.net">JBlack@kamentertainment.net</a></div>
    </div>
    </div>
    <div class="overflowclear emailRow" id="emailStaffTenRow">
    <div class="emailCell">
    <div class="emailTitle">Lisa Davidson</div>
    <div class="emailSubTitle">Post-Production Graphics</div>
    <div><a class="contactemail" href="mailto:LDavidson@kamentertainment.net">LDavidson@kamentertainment.net</a></div>
    </div>
    <div class="emailCell">
     
    </div>
    </div>
    <div class="departmentHeader">Production</div>
    <div class="overflowclear emailRow" id="emailStaffElevenRow">
    <div class="emailCell">
    <div class="emailTitle">Aleesha Rodriguez</div>
    <div class="emailSubTitle">EVP of Project Development</div>
    <div><a class="contactemail" href="mailto:ARodriguez@kamentertainment.net">ARodriguez@kamentertainment.net</a></div>
    </div>
    <div class="emailCell">
    <div class="emailTitle">Kyle Day</div>
    <div class="emailSubTitle">Manager of Project Development</div>
    <div><a class="contactemail" href="mailto:KDay@kamentertainment.net">KDay@kamentertainment.net</a></div>
    </div>
    </div>
    <div class="overflowclear emailRow" id="emailStaffTweleveRow">
    <div class="emailCell">
    <div class="emailTitle">Cynthia Griffiths</div>
    <div class="emailSubTitle">Producer</div>
    <div><a class="contactemail" href="mailto:CGriffiths@kamentertainment.net">CGriffiths@kamentertainment.net</a></div>
    </div>
    <div class="emailCell">
    <div class="emailTitle">Justin Sydney</div>
    <div class="emailSubTitle">Producer</div>
    <div><a class="contactemail" href="mailto:JSydney@kamentertainment.net">JSydney@kamentertainment.net</a></div>
    </div>
    </div>
    <div class="departmentHeader">Sales</div>
    <div class="overflowclear emailRow" id="emailStaffThirteenRow">
    <div class="emailCell">
    <div class="emailTitle">Christa Archer</div>
    <div class="emailSubTitle">EVP Sales</div>
    <div><a class="contactemail" href="mailto:CArcher@kamentertainment.net">CArcher@kamentertainment.net</a></div>
    </div>
    <div class="emailCell">
    <div class="emailTitle">Li Feng</div>
    <div class="emailSubTitle">Sales Director</div>
    <div><a class="contactemail" href="mailto:LFeng@kamentertainment.net">LFeng@kamentertainment.net</a></div>
    </div>
    </div>
    <div class="overflowclear emailRow" id="emailStaffFourteenRow">
    <div class="emailCell">
    <div class="emailTitle">Jennifer Hooper</div>
    <div class="emailSubTitle">Sales Associate</div>
    <div><a class="contactemail" href="mailto:JHooper@kamentertainment.net">JHooper@kamentertainment.net</a></div>
    </div>
    <div class="emailCell">
     
    </div>
    </div>
    </div>
    
    </div>
    </div>';
    

    I of course would prefer a PHP/MySQL solution, but not if it's going to be this unreasonably difficult to implement, I'm not going to bother. 

     

    This is where I got with the PHP code:

    if($staffQuery=mysqli_query($staffConnected, "SELECT `name`, `email`, `department`, `position` FROM `staff` WHERE `class`=2 ORDER BY `department`, `name` ASC")){  
            $rowNum=1;  
            $cellNum=0;  
            $checkBlank=0; 
            $amountOfStaffReturned=mysqli_num_rows($staffQuery);  
                if($amountOfStaffReturned>0){ 
                $departmentHeader=false;  
                $content.='<div class="emailHeader">Staff Contacts</div>';  
                    while($staff=mysqli_fetch_array($staffQuery, MYSQLI_ASSOC)){ 
                    $staffName=$staff['name']; $staffEmail=$staff['email']; $staffDepartment=$staff['department']; $staffPosition=$staff['position'];  
                    $rowName=rowName($rowNum);  
                        if($rowNum>1){$rowEmailClassAdd=' emailRow';}else{$rowEmailClassAdd='';}  
                        if($cellNum%2==0){ 
                        if($cellNum!=0){$content.='</div>';}
                        if($departmentHeader!=$staffDepartment){$content.='<div class="departmentHeader">'.$staffDepartment.'</div>';$departmentHeader=$staffDepartment;} 
                        $content.='<div class="overflowclear'.$rowEmailClassAdd.'" id="emailStaff'.ucfirst($rowName).'Row">';  
                        $rowNum++;  
                        }
                            if($departmentHeader==$staffDepartment){ 
                            $checkBlank++; 
                            $content.='  
                            <div class="emailCell">  
                            <div class="emailTitle">'.$staffName.'</div>  
                            <div class="emailSubTitle">'.$staffPosition.'</div>  
                            <div><a class="contactemail" href="mailto:'.$staffEmail.'">'.escapeemail($staffEmail).'</a></div>  
                            </div>'; 
                            } 
                            elseif($departmentHeader!=$staffDepartment){ 
                                if($checkBlank%2==0){ 
                                $content.='<div class="emailCell">  
                                <div class="emailTitle">'.$staffName.'</div>  
                                <div class="emailSubTitle">'.$staffPosition.'</div>  
                                <div><a class="contactemail" href="mailto:'.$staffEmail.'">'.escapeemail($staffEmail).'</a></div>  
                                </div>'; 
                                } 
                                else{ 
                                $content.='<div class="emailCell">  
                                   
                                </div>'; 
                                } 
                            $checkBlank=0; 
                            }
                    $cellNum++; 
                    } 
                $content.='</div>'; 
                }
    }  
    

    That gets me here: http://www.kamentertainment.net/staff

     

    Close but still not right. The cell that needs to be moved is removed and replaced with the blank cell... however, the removed cell isn't placed in to it's proper department... it just disappears. I'm probably missing something here but not sure what...

  13. Just to clear things up a bit, the Assistants group should only have three employees in it, Information Technology should also have three (Dennis O'Neal) should be moved down to the IT group, the Post-Production group should have three, the Production group should have four, and the sales group should have three. 

  14. If you're wrapping your html with double quotes all you have to do is use the variable inside the double quotes:

    echo "<td valign='top' width='123'><font face='Arial, Helvetica, sans-serif' size='2'><img id='cpt_img' src='$path.$img'>"

    If you're using single quotes with the echo (which it seems like you are not) then you have to escape variables, by concatenating the variables to the echo:

    echo '<td valign="top" width="123"><font face="Arial, Helvetica, sans-serif" size="2"><img id="cpt_img" src="'.$path.$img.'">'
     
    Also just as a note of HTML code, you should close or self close img tags.
     
    <img id="cpt_img" src=""></img> or <img id="cpt_img" src="" />
  15. On this page I have a bunch of contact information for each individual employee in the company:
    http://www.kamentertainment.net/contact
     
    Everything is grouped together properly except when a category has an odd number of employees. In this case the first employee for the next category is added to the previous category. 
     
    How do I fix this, so that if a category only has three employees the fourth div cell in the group is generated with a blank div cell?
     
     

    if($staffQuery=mysqli_query($staffConnected, "SELECT `name`, `email`, `department`, `position` FROM `staff` WHERE `class`=2 ORDER BY `department`, `name` ASC")){
    $rowNum=1;
    $cellNum=0;
    $amountOfStaffReturned=mysqli_num_rows($staffQuery);
    if($amountOfStaffReturned>0){
    $departmentHeader=false;
    $content.='<div class="emailHeader">Staff Contacts</div>';
    while($staff=mysqli_fetch_array($staffQuery, MYSQLI_ASSOC)){
    $staffName=$staff['name']; $staffEmail=$staff['email']; $staffDepartment=$staff['department']; $staffPosition=$staff['position'];
    $rowName=rowName($rowNum);
    if($rowNum>1){$rowEmailClassAdd=' emailRow';}else{$rowEmailClassAdd='';}
    if($cellNum%2==0){
    if($departmentHeader!=$staffDepartment){$content.='<div class="departmentHeader">'.$staffDepartment.'</div>'; $departmentHeader=$staffDepartment;}else{}
    if($cellNum!=0){$content.='</div>';}else{}
    $content.='<div class="overflowclear'.$rowEmailClassAdd.'" id="emailStaff'.ucfirst($rowName).'Row">';
    $rowNum++;
    }else{}
    $content.='
    <div class="emailCell">
    <div class="emailTitle">'.$staffName.'</div>
    <div class="emailSubTitle">'.$staffPosition.'</div>
    <div><a class="contactemail" href="mailto:'.$staffEmail.'">'.escapeemail($staffEmail).'</a></div>
    </div>';
    if(($amountOfStaffReturned%2!=0 && $cellNum+1==$amountOfStaffReturned)){
    $content.='<div class="emailCell">
     
    </div>
    </div>';
    }else{}
    $cellNum++;
    }
    }else{}
    }
    
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.