VPF::Помогите переделать страницу с table в div

Marchello2005

Дата 9.10.2010, 15:45 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 4
Регистрация: 9.10.2010

Репутация: нет
Всего: нет

Помогите переделать страницу с table в div. практичски всьо переведено, но с тем что осталось немогу разобратся (очень хитрый код). Уже переделывал 20 раз ничего не получается. Файли прикриплю. Кто может стаким стыкался, помогите. Файл шаблона bt travelin Joomla 1.5 php и файл слоев CSS прикрепляю как тестовие. Буду признателен любой помощи. Выкладываю и тут файлики

Код


<?php

defined( '_JEXEC' ) or die( 'Restricted access' );

$dir = dirname(__FILE__);

require($dir . '/config.php');

require($dir . '/template.inc.php');

$tpl = new TplBtTravelIn();

$cmenu_css = $tpl->show_menu ? '<link href="' . $tpl->path . '/css/cmenu.css" rel="stylesheet" type="text/css" />' . "\n" : '';

$cmenu_js = $tpl->show_menu ? '<script type="text/javascript" src="' . $tpl->path . '/js/cmenu.js"></script>' . "\n" : '';

$ddp2_width = $tpl->width - 64;

echo <<<EOF

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="{$this->language}" lang="{$this->language}" >

<head>



<jdoc:include type="head" />



<style type="text/css">

.ddp2_content { width: {$ddp2_width}px; }

</style>

<link href="{$tpl->path}/css/layout.css" rel="stylesheet" type="text/css" />

<link href="{$tpl->path}/css/template.css" rel="stylesheet" type="text/css" />

$cmenu_css

<!--[if lt IE 7]>

<link href="{$tpl->path}/css/template_ie6.css" rel="stylesheet" type="text/css" />

<![endif]-->





</head>



<body>

$aa



EOF;





if ($tpl->seocp) {

    echo '    <div style="display:none"><div id="mainbody">' . "\n";

    echo '        <jdoc:include type="component" />' . "\n";

    echo '    </div></div>' . "\n";

}



echo '<div align="center">' . "\n";

echo '<table cellspacing="0" cellpadding="0" width="' . $tpl->width . '" style="text-align:left">' . "\n";

echo '    <tr>' . "\n";

echo '        <td id="r1lb" valign="top" rowspan="2"><img src="' . $tpl->path . '/images/layout/r1l.gif" alt="" /></td>' . "\n";

echo '        <td id="top" valign="top">' . "\n";

echo '            <div id="top_r1_over"></div>' . "\n";

echo '            <div id="top_r1">' . "\n";

$tpl->echo_positions('', 'top', 'toolbar');

echo '            </div>' . "\n";

echo '            <div id="top_r2_over"></div>' . "\n";

echo '            <div id="top_r2">' . "\n";

$tpl->echo_positions('', 'icon', 'inset');

echo '            </div>' . "\n";

echo '            <div id="top_r3_over"></div>' . "\n";

echo '            <div id="top_r3">' . "\n";

echo '                <table cellspacing="0" cellpadding="0" width="100%">' . "\n";

echo '                    <tr>' . "\n";

echo '                        <td valign="top">' . "\n";



if ($tpl->show_menu) {

echo <<<EOF

                            <div id="cmenu">

                                <table cellspacing="0" cellpadding="0">

                                    <tr>



EOF;



    for ($i = 0, $len = count($tpl->menu_head_tags); $i < $len; $i++) {

        $mi = &$tpl->menu_head_tags[$i];

        printf(

'                                        <td class="cmenu_hd_gap"></td>

                                        <td class="%s">&nbsp;</td>

                                        <td class="%s" id="%s">%s</td>

                                        <td class="%s">&nbsp;</td>

',

            $mi->selection == 0 ? 'cmenu_hd_norm_left' : 'cmenu_hd_sel_left',

            $mi->selection == 0 ? 'cmenu_hd_norm_body' : 'cmenu_hd_sel_body',

            $mi->head_id,

            $mi->full_link,

            $mi->selection == 0 ? 'cmenu_hd_norm_right' : 'cmenu_hd_sel_right'

        );

    }

    echo '                                        <td class="cmenu_hd_gap"></td>' . "\n";



echo <<<EOF

                                    </tr>

                                </table>

                            </div>



EOF;



}

else {

    $tpl->echo_position('header');

}



echo '                        </td>' . "\n";



if ($tpl->modcount('cpanel')) {

    echo '                        <td class="gap"></td>' . "\n";

    echo '                        <td valign="top" align="right">' . "\n";

    $tpl->echo_position('cpanel');

    echo '                        </td>' . "\n";

}

echo '                    </tr>' . "\n";

echo '                </table>' . "\n";

echo '            </div>' . "\n";

echo '        </td>' . "\n";

echo '        <td id="r1rb" valign="top" rowspan="2"><img src="' . $tpl->path . '/images/layout/r1r.gif" alt="" /></td>' . "\n";

echo '    </tr>' . "\n";

echo '    <tr>' . "\n";

echo '        <td id="r1body" valign="top">' . "\n";

$tpl->echo_positions('', 'advert1', 'advert2', 'advert3');





// output main body area



$col_span = 0;

if ($tpl->modcount('left'))

    $col_span += 2;

if ($tpl->modcount('right'))

    $col_span += 2;

$col_span = $col_span == 0 ? '' : ' colspan="' . ($col_span + 1) . '"';



echo '<table cellspacing="0" cellpadding="0" width="100%">' . "\n";

echo '    <tr>' . "\n";

echo '        <td id="main_path_l"></td>' . "\n";

echo '        <td id="main_path_c"' . $col_span . '>' . "\n";

echo '            <img src="' . $tpl->path . '/images/layout/pathway.gif" alt="" border="0" style="float:left" />' . "\n";

echo '            &nbsp; <span id="pathway_start">' . JText::_('') . '</span>&nbsp;' . "\n";



echo '            <span id="pathway">' . "\n";

echo '                <jdoc:include type="modules" name="breadcrumb" />' . "\n";

echo '            </span>' . "\n";



echo '        </td>' . "\n";

echo '        <td id="main_path_r"></td>' . "\n";

echo '    </tr>' . "\n";



// output top row of main body

echo '    <tr>' . "\n";



if ($tpl->modcount('left')) {

    echo '        <td id="main_left_tl"><img src="' . $tpl->path . '/images/layout/main_left_tl.gif" alt="" /></td>' . "\n";

    echo '        <td id="main_left_tc"></td>' . "\n";

    echo '        <td id="main_left_tr"><img src="' . $tpl->path . '/images/layout/main_left_tr.gif" alt="" /></td>' . "\n";

}

else {

    echo '        <td id="main_body_tl"><img src="' . $tpl->path . '/images/layout/main_body_tl.gif" alt="" /></td>' . "\n";

}



echo '        <td id="main_body_tc"></td>' . "\n";



if ($tpl->modcount('right')) {

    echo '        <td id="main_right_tl"><img src="' . $tpl->path . '/images/layout/main_right_tl.gif" alt="" /></td>' . "\n";

    echo '        <td id="main_right_tc"></td>' . "\n";

    echo '        <td id="main_right_tr"><img src="' . $tpl->path . '/images/layout/main_right_tr.gif" alt="" /></td>' . "\n";

}

else {

    echo '        <td id="main_body_tr"><img src="' . $tpl->path . '/images/layout/main_body_tr.gif" alt="" /></td>' . "\n";

}



echo '    </tr>' . "\n";



// output middle row of main body

echo '    <tr>' . "\n";



if ($tpl->modcount('left')) {

    echo '        <td id="main_left_ml"></td>' . "\n";

    echo '        <td id="main_left_mc" valign="top">' . "\n";

    $tpl->echo_position('left');

    echo '        </td>' . "\n";

    echo '        <td id="main_left_mr"></td>' . "\n";

}

else {

    echo '        <td id="main_body_ml"></td>' . "\n";

}



echo '        <td id="main_body_mc" valign="top">' . "\n";



// output position newsflash

if ($tpl->modcount('newsflash')) {

    $tpl->echo_position('newsflash');

    echo '            <div class="gap"></div>' . "\n";

}



// output main body

if ($tpl->seocp)

    echo '        <div id="mainbody_area"></div>' . "\n";

else

    echo '        <jdoc:include type="component" />' . "\n";



// output position banner

if ($tpl->modcount('banner')) {

    echo '            <div class="gap"></div>' . "\n";

    $tpl->echo_position('banner');

}



echo '        </td>' . "\n";



if ($tpl->modcount('right')) {

    echo '        <td id="main_right_ml"></td>' . "\n";

    echo '        <td id="main_right_mc" valign="top">' . "\n";

    $tpl->echo_position('right');

    echo '        </td>' . "\n";

    echo '        <td id="main_right_mr"></td>' . "\n";

}

else {

    echo '        <td id="main_body_mr"></td>' . "\n";

}



echo '    </tr>' . "\n";



// output bottom row of main body

echo '    <tr>' . "\n";



if ($tpl->modcount('left')) {

    echo '        <td id="main_left_bl"></td>' . "\n";

    echo '        <td id="main_left_bc"></td>' . "\n";

    echo '        <td id="main_left_br"></td>' . "\n";

}

else {

    echo '        <td id="main_body_bl"></td>' . "\n";

}



echo '        <td id="main_body_bc"></td>' . "\n";



if ($tpl->modcount('right')) {

    echo '        <td id="main_right_bl"></td>' . "\n";

    echo '        <td id="main_right_bc"></td>' . "\n";

    echo '        <td id="main_right_br"></td>' . "\n";

}

else {

    echo '        <td id="main_body_br"></td>' . "\n";

}



echo '    </tr>' . "\n";



echo '</table>' . "\n";





if ($tpl->modcount('user1') || $tpl->modcount('user2') || $tpl->modcount('user3')) {

    echo '            <div class="gap"></div>' . "\n";

    $tpl->echo_positions('', 'user1', 'user2', 'user3');

}





if ($tpl->modcount('user4') || $tpl->modcount('user5') || $tpl->modcount('user6')) {

    echo '            <div class="gap"></div>' . "\n";

    echo '            <table cellspacing="0" cellpadding="0" width="100%">' . "\n";

    echo '                <tr>' . "\n";

    echo '                    <td id="blue_tl"></td>' . "\n";

    echo '                    <td id="blue_tc"></td>' . "\n";

    echo '                    <td id="blue_tr"></td>' . "\n";

    echo '                </tr>' . "\n";

    echo '                <tr>' . "\n";

    echo '                    <td id="blue_ml"></td>' . "\n";

    echo '                    <td id="blue_mc">' . "\n";

    $tpl->echo_positions('', 'user4', 'user5', 'user6');

    echo '                    </td>' . "\n";

    echo '                    <td id="blue_mr"></td>' . "\n";

    echo '                </tr>' . "\n";

    echo '                <tr>' . "\n";

    echo '                    <td id="blue_bl"></td>' . "\n";

    echo '                    <td id="blue_bc"></td>' . "\n";

    echo '                    <td id="blue_br"></td>' . "\n";

    echo '                </tr>' . "\n";

    echo '            </table>' . "\n";

}



echo '        </td>' . "\n";

echo '    </tr>' . "\n";

echo '    <tr>' . "\n";

echo '        <td id="r2l"></td>' . "\n";

echo '        <td id="r2c"></td>' . "\n";

echo '        <td id="r2r"></td>' . "\n";

echo '    </tr>' . "\n";

echo '    <tr>' . "\n";

echo '        <td id="r2lb"></td>' . "\n";

echo '        <td id="r2body" valign="top">' . "\n";

$tpl->echo_positions('', 'user7', 'user8', 'user9');

echo '        </td>' . "\n";

echo '        <td id="r2rb"></td>' . "\n";

echo '    </tr>' . "\n";

echo '    <tr>' . "\n";

echo '        <td id="r3l"></td>' . "\n";

echo '        <td id="r3c"></td>' . "\n";

echo '        <td id="r3r"></td>' . "\n";

echo '    </tr>' . "\n";

echo '    <tr>' . "\n";

echo '        <td id="r3lb"></td>' . "\n";

echo '        <td id="r3body" valign="top">' . "\n";

$tpl->echo_positions('', 'bottom', 'footer');

echo '        </td>' . "\n";

echo '        <td id="r3rb"></td>' . "\n";

echo '    </tr>' . "\n";

echo '    <tr>' . "\n";

echo '        <td id="r4l"></td>' . "\n";

echo '        <td id="r4c"></td>' . "\n";

echo '        <td id="r4r"></td>' . "\n";

echo '    </tr>' . "\n";

echo '    <tr>' . "\n";

echo '        <td></td>' . "\n";

echo '        <td id="r5c" align="center" valign="top">' . "\n";

echo '        </td>' . "\n";

echo '        <td></td>' . "\n";

echo '    </tr>' . "\n";

echo '</table>' . "\n";

echo '</div>' . "\n";


echo <<<EOF

</body>

</html>

EOF;

?>

и файл CSS

Код


/**
 * Layout CSS for the BonusThemes.com Travel In Template
 *
 * @package bt_travelin
 * @version 1.0
 * @copyright BonusThemes.com 2008
 * @link http://www.bonusthemes.com/goto/bt_travelin
 */

* {
    margin: 0;
    padding: 0;
}

html {
    margin-bottom: 1px;
    height: 100% !important;
    height: auto;
}

body {
    height: 100%;
    background: #eaf4fb url(../images/layout/back.gif) repeat-x top left;
}

.gap {
    width: 10px;
    height: 10px;
    overflow: hidden;
}

#spacer1, #spacer2, #spacer3, #spacer4, #spacer5, #spacer6, #spacer7 {
    height: 20px;
    overflow: hidden;
}

#top {
    height: 210px;
    overflow: hidden;
    background: #fff url(../images/layout/top_back.gif) repeat-x top left;
}

    #top_r1_over {
        height: 10px;
        overflow: hidden;
    }
    #top_r1 {
        height: 30px;
        overflow: hidden;
    }
    #top_r2_over {
        height: 25px;
        overflow: hidden;
    }
    #top_r2 {
        height: 70px;
        overflow: hidden;
    }
    #top_r3_over {
        height: 10px;
        overflow: hidden;
    }
    #top_r3 {
        height: 51px;
        overflow: hidden;
    }


#r1lb {
    width: 32px;
    overflow: hidden;
    background: url(../images/layout/r1lb.gif) repeat-y top left;
}

#r1rb {
    width: 32px;
    overflow: hidden;
    background: url(../images/layout/r1rb.gif) repeat-y top left;
}

#r1body {
    background-color: #fff;
}

#r2l {
    height: 16px;
    overflow: hidden;
    background: url(../images/layout/r2l.gif) no-repeat top left;
}
#r2c {
    height: 16px;
    overflow: hidden;
    background: url(../images/layout/r2c.gif) repeat-x top left;
}
#r2r {
    height: 16px;
    overflow: hidden;
    background: url(../images/layout/r2r.gif) no-repeat top left;
}

#r2lb {
    width: 32px;
    overflow: hidden;
    background: url(../images/layout/r2lb.gif) repeat-y top left;
}
#r2body {
    background-color: #34b4e6;
}
#r2rb {
    width: 32px;
    overflow: hidden;
    background: url(../images/layout/r2rb.gif) repeat-y top left;
}

#r3l {
    height: 17px;
    overflow: hidden;
    background: url(../images/layout/r3l.gif) no-repeat top left;
}
#r3c {
    height: 17px;
    overflow: hidden;
    background: url(../images/layout/r3c.gif) repeat-x top left;
}
#r3r {
    height: 17px;
    overflow: hidden;
    background: url(../images/layout/r3r.gif) no-repeat top left;
}

#r3lb {
    width: 32px;
    overflow: hidden;
    background: url(../images/layout/r3lb.gif) repeat-y top left;
}
#r3body {
    background-color: #258fcd;
}
#r3rb {
    width: 32px;
    overflow: hidden;
    background: url(../images/layout/r3rb.gif) repeat-y top left;
}

#r4l {
    height: 27px;
    overflow: hidden;
    background: url(../images/layout/r4l.gif) no-repeat top left;
}
#r4c {
    height: 27px;
    overflow: hidden;
    background: url(../images/layout/r4c.gif) repeat-x top left;
}
#r4r {
    height: 27px;
    overflow: hidden;
    background: url(../images/layout/r4r.gif) no-repeat top left;
}

#r5c {
    padding-top: 20px;
    padding-bottom: 20px;
}

#main_path_l {
    width: 15px;
    height: 38px;
    overflow: hidden;
    background: url(../images/layout/main_path_l.gif) no-repeat top left;
}
#main_path_c {
    height: 38px;
    overflow: hidden;
    background: url(../images/layout/main_path_c.gif) repeat-x top left;
}
#main_path_r {
    width: 15px;
    height: 38px;
    overflow: hidden;
    background: url(../images/layout/main_path_r.gif) no-repeat top left;
}

#main_body_tl, #main_body_tr, #main_body_bl, #main_body_br,
#main_left_tl, #main_left_tr, #main_left_bl, #main_left_br,
#main_right_tl, #main_right_tr, #main_right_bl, #main_right_br {
    width: 15px;
    height: 15px;
    overflow: hidden;
}

#main_body_tc, #main_body_bc,
#main_left_tc, #main_left_bc,
#main_right_tc, #main_right_bc {
    height: 15px;
    overflow: hidden;
}

#main_body_ml, #main_body_mr,
#main_left_ml, #main_left_mr,
#main_right_ml, #main_right_mr {
    width: 15px;
    overflow: hidden;
}

#main_left_tr, #main_left_mr, #main_left_br, 
#main_right_tl, #main_right_ml, #main_right_bl {
    width: 30px;
}

#main_body_tl { background: url(../images/layout/main_body_tl.gif) no-repeat top left; }
#main_body_tc { background: url(../images/layout/main_body_tc.gif) repeat-x top left; }
#main_body_tr { background: url(../images/layout/main_body_tr.gif) no-repeat top left; }
#main_body_ml { background: url(../images/layout/main_body_ml.gif) repeat-y top left; }
#main_body_mc { background-color: #fff; }
#main_body_mr { background: url(../images/layout/main_body_mr.gif) repeat-y top left; }
#main_body_bl { background: url(../images/layout/main_body_bl.gif) no-repeat top left; }
#main_body_bc { background: url(../images/layout/main_body_bc.gif) repeat-x top left; }
#main_body_br { background: url(../images/layout/main_body_br.gif) no-repeat top left; }

#main_left_tl { background: url(../images/layout/main_left_tl.gif) no-repeat top left; }
#main_left_tc { background: url(../images/layout/main_left_tc.gif) repeat-x top left; }
#main_left_tr { background: url(../images/layout/main_left_tr.gif) no-repeat top left; }
#main_left_ml { background: url(../images/layout/main_left_ml.gif) repeat-y top left; }
#main_left_mc { background-color: #ddf4ff; width: 165px; } /* left_width */
#main_left_mr { background: url(../images/layout/main_left_mr.gif) repeat-y top left; }
#main_left_bl { background: url(../images/layout/main_left_bl.gif) no-repeat top left; }
#main_left_bc { background: url(../images/layout/main_left_bc.gif) repeat-x top left; }
#main_left_br { background: url(../images/layout/main_left_br.gif) no-repeat top left; }

#main_right_tl { background: url(../images/layout/main_right_tl.gif) no-repeat top left; }
#main_right_tc { background: url(../images/layout/main_right_tc.gif) repeat-x top left; }
#main_right_tr { background: url(../images/layout/main_right_tr.gif) no-repeat top left; }
#main_right_ml { background: url(../images/layout/main_right_ml.gif) repeat-y top left; }
#main_right_mc { background-color: #ddf4ff; } /* right_width */
#main_right_mr { background: url(../images/layout/main_right_mr.gif) repeat-y top left; }
#main_right_bl { background: url(../images/layout/main_right_bl.gif) no-repeat top left; }
#main_right_bc { background: url(../images/layout/main_right_bc.gif) repeat-x top left; }
#main_right_br { background: url(../images/layout/main_right_br.gif) no-repeat top left; }

#blue_tl {
    width: 16px;
    height: 16px;
    overflow: hidden;
    background: url(../images/layout/blue_tl.gif) no-repeat top left;
}
#blue_tc {
    height: 16px;
    overflow: hidden;
    background: url(../images/layout/blue_tc.gif) repeat-x top left;
}
#blue_tr {
    width: 16px;
    height: 16px;
    overflow: hidden;
    background: url(../images/layout/blue_tr.gif) no-repeat top left;
}
#blue_ml {
    width: 16px;
    overflow: hidden;
    background: url(../images/layout/blue_ml.gif) repeat-y top left;
}
#blue_mc {
    background-color: #ddf4ff;
}
#blue_mr {
    width: 16px;
    overflow: hidden;
    background: url(../images/layout/blue_mr.gif) repeat-y top left;
}
#blue_bl {
    width: 16px;
    height: 16px;
    overflow: hidden;
    background: url(../images/layout/blue_bl.gif) no-repeat top left;
}
#blue_bc {
    height: 16px;
    overflow: hidden;
    background: url(../images/layout/blue_bc.gif) repeat-x top left;
}
#blue_br {
    width: 16px;
    height: 16px;
    overflow: hidden;
    background: url(../images/layout/blue_br.gif) no-repeat top left;
}

#r2body .gap {
    width: 25px;
    background: url(../images/layout/splitter.gif) no-repeat center center;
}



.ddp1_tl, .ddp1_tc, .ddp1_tr, .ddp1_ml, .ddp1_content, .ddp1_mr, .ddp1_bl, .ddp1_bc, .ddp1_br, .ddp1_tag_l, .ddp1_tag, .ddp1_tag_r {
    background: #d3e7f1;
}
.ddp1_tc {
    height: 12px;
}
.ddp1_bl {
    width: 12px;
    height: 12px;
    background: url(../images/layout/ddp1_bl.gif) no-repeat top left;
}
.ddp1_br {
    width: 12px;
    height: 12px;
    background: url(../images/layout/ddp1_br.gif) no-repeat top left;
}
.ddp1_tag_l {
    width: 17px;
    height: 18px;
    background: url(../images/layout/ddp1_left.gif) no-repeat top left;
}
.ddp1_tag_r {
    width: 17px;
    height: 18px;
    background: url(../images/layout/ddp1_right.gif) no-repeat top left;
}
.ddp1_tag {
    background: #d3e7f1 url(../images/layout/ddp1_bullet.gif) no-repeat 0px 6px;
}
.ddp1_tag h3 {
    text-indent: 12px;
    color: #258fcc;
    font-weight: normal;
    font-size: 11px;
    height: 18px;
    line-height: 18px;
    margin: 0;
    padding: 0;
}
.ddp1_content {
}


.ddp2_tl { background: url(../images/layout/ddp2_tl.gif) no-repeat top left; }
.ddp2_tc { background: url(../images/layout/ddp2_tc.gif) repeat-x top left; }
.ddp2_tr { background: url(../images/layout/ddp2_tr.gif) no-repeat top left; }
.ddp2_ml { background: url(../images/layout/ddp2_ml.gif) repeat-y top left; }
.ddp2_mr { background: url(../images/layout/ddp2_mr.gif) repeat-y top left; }
.ddp2_bl { background: url(../images/layout/ddp2_bl.gif) no-repeat top left; }
.ddp2_bc { background: url(../images/layout/ddp2_bc.gif) repeat-x top left; }
.ddp2_br { background: url(../images/layout/ddp2_br.gif) no-repeat top left; }
.ddp2_tl, .ddp2_tr, .ddp2_bl, .ddp2_br {
    width: 12px;
    height: 12px;
}
.ddp2_ml, .ddp2_mr {
    width: 12px;
}
.ddp2_tc, .ddp2_bc {
    height: 12px;
}
.ddp2_tag_l {
    width: 15px;
    height: 14px;
    background: url(../images/layout/ddp2_left.gif) no-repeat top left;
}
.ddp2_tag_r {
    width: 15px;
    height: 14px;
    background: url(../images/layout/ddp2_right.gif) no-repeat top left;
}
.ddp2_tag {
    background: #35b4e7 url(../images/layout/ddp2_bullet.gif) no-repeat 0px 4px;
}
.ddp2_tag h3 {
    text-indent: 12px;
    color: #fff;
    font-weight: normal;
    font-size: 11px;
    height: 14px;
    line-height: 14px;
    margin: 0;
    padding: 0;
}
.ddp2_content {
    background: #35b4e7;
}

KuZyagroup

Дата 10.10.2010, 15:03 (ссылка)

(нет голосов)

Загрузка ...

magento solution

Профиль
Группа: Участник
Сообщений: 283
Регистрация: 16.4.2007
Где: Kiev

Репутация: 2
Всего: 4

Проверяйте орфографию(вордом, браузером, чем угодно)

Вы выложили 1000 строк кода. Мне кажется вам никто на этом форуме не станет помогать. Опишите конкретно что не понятно, что не выходит, что пробовали делать

Marchello2005

Дата 10.10.2010, 15:39 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 4
Регистрация: 9.10.2010

Репутация: нет
Всего: нет

вот например часть кода меню ее надо переделать с таблиц в div

Код


if ($tpl->show_menu) {
echo <<<EOF
                            <div id="cmenu">
                                <table cellspacing="0" cellpadding="0">
                                    <tr>
EOF;
    for ($i = 0, $len = count($tpl->menu_head_tags); $i < $len; $i++) {
        $mi = &$tpl->menu_head_tags[$i];
        printf(
'                                        <td class="cmenu_hd_gap"></td>
                                        <td class="%s">&nbsp;</td>
                                        <td class="%s" id="%s">%s</td>
                                        <td class="%s">&nbsp;</td>
',
            $mi->selection == 0 ? 'cmenu_hd_norm_left' : 'cmenu_hd_sel_left',
            $mi->selection == 0 ? 'cmenu_hd_norm_body' : 'cmenu_hd_sel_body',
            $mi->head_id,
            $mi->full_link,
            $mi->selection == 0 ? 'cmenu_hd_norm_right' : 'cmenu_hd_sel_right'
        );
    }
    echo '                                        <td class="cmenu_hd_gap"></td>' . "\n";
echo <<<EOF
                                    </tr>
                                </table>
                            </div>
EOF;
}

+CSS

Код


#cmenu {
    margin-top: 9px;
}

.cmenu_hd_gap {
    width: 1px;
    overflow: hidden;
    background: url(../images/layout/menu_gap.gif) no-repeat top left;
}

.cmenu_hd_norm_left {
    background: url(../images/layout/menu_norm_left.gif) no-repeat top left;
}
.cmenu_hd_normhover_left {
    background: url(../images/layout/menu_normhover_left.gif) no-repeat top left;
}
.cmenu_hd_sel_left {
    background: url(../images/layout/menu_sel_left.gif) no-repeat top left;
}
.cmenu_hd_norm_body {
    background: url(../images/layout/menu_norm_body.gif) repeat-x top left;
}
.cmenu_hd_normhover_body {
    background: url(../images/layout/menu_normhover_body.gif) repeat-x top left;
}
.cmenu_hd_sel_body {
    background: url(../images/layout/menu_sel_body.gif) repeat-x top left;
}
.cmenu_hd_norm_right {
    background: url(../images/layout/menu_norm_right.gif) no-repeat top left;
}
.cmenu_hd_normhover_right {
    background: url(../images/layout/menu_normhover_right.gif) no-repeat top left;
}
.cmenu_hd_sel_right {
    background: url(../images/layout/menu_sel_right.gif) no-repeat top left;
}

.cmenu_hd_norm_left,
.cmenu_hd_normhover_left,
.cmenu_hd_sel_left,
.cmenu_hd_norm_body,
.cmenu_hd_normhover_body,
.cmenu_hd_sel_body,
.cmenu_hd_norm_right,
.cmenu_hd_normhover_right,
.cmenu_hd_sel_right {
    height: 42px;
    overflow: hidden;
    text-align: center;
    text-decoration: none;
}
.cmenu_hd_norm_left,
.cmenu_hd_normhover_left,
.cmenu_hd_sel_left,
.cmenu_hd_norm_right,
.cmenu_hd_normhover_right,
.cmenu_hd_sel_right {
    width: 12px;
}
.cmenu_hd_norm_body a, .cmenu_hd_norm_body a:visited,
.cmenu_hd_normhover_body a, .cmenu_hd_normhover_body a:visited,
.cmenu_hd_sel_body a, .cmenu_hd_sel_body a:visited {
    color: #258fcc;
    font-weight: bold;
    font-size: 12px;
    text-decoration: none;
}
.cmenu_hd_sel_body a, .cmenu_hd_sel_body a:visited {
    color: #fd7e00;
}

.cmenu_mi_empty_normal {
    height: 27px;
}

.cmenu_mi_empty_hover {
    height: 27px;
}

.cmenu_mi_full_normal {
    background: url(../images/layout/ddmenu_submenu.gif) no-repeat center right;
    height: 27px;
}

.cmenu_mi_full_hover {
    background: url(../images/layout/ddmenu_submenu.gif) no-repeat center right;
    height: 27px;
}

.cmenu_mi_empty_normal .text,
.cmenu_mi_full_normal .text {
    color: #fff;
    padding: 7px 25px 5px 5px;
}

.cmenu_mi_empty_hover .text,
.cmenu_mi_full_hover .text {
    background: #02649d;
    color: #fff;
    padding: 7px 25px 5px 5px;
}
.cmenu_mi_full_hover .text {
    background: #02649d url(../images/layout/ddmenu_submenu.gif) no-repeat center right;
}

.cmenu_separator {
}

.cmenu_itemborder {
}

.cmenu_tl {
    background: url(../images/layout/ddmenu_tl.gif) repeat-x top left;
    width: 5px;
    height: 7px;
}

.cmenu_tc {
    background: url(../images/layout/ddmenu_tc.gif) repeat-x top left;
    height: 7px;
}

.cmenu_tr {
    background: url(../images/layout/ddmenu_tr.gif) no-repeat top right;
    width: 5px;
    height: 7px;
}

.cmenu_ml {
    background: url(../images/layout/ddmenu_ml.gif) repeat-y top left;
    width: 5px;
}

.cmenu_panel {
    background-color: #258fcc;
    text-align: left;
}

.cmenu_mr {
    background: url(../images/layout/ddmenu_mr.gif) repeat-y top right;
    width: 5px;
}

.cmenu_bl {
    background: url(../images/layout/ddmenu_bl.gif) no-repeat bottom left;
    width: 5px;
    height: 7px;
}

.cmenu_bc {
    background: url(../images/layout/ddmenu_bc.gif) repeat-x bottom left;
    height: 7px;
}

.cmenu_br {
    background: url(../images/layout/ddmenu_br.gif) no-repeat bottom right;
    width: 5px;
    height: 7px;
}

Добавлено через 3 минуты и 9 секунд
делал так
<table> - div-обертка для блока
<tr> - div-обертка для строки
<td> - div'ы с float:left
но меню некоректно отображается

KuZyagroup

Дата 11.10.2010, 05:27 (ссылка)

(нет голосов)

Загрузка ...

magento solution

Профиль
Группа: Участник
Сообщений: 283
Регистрация: 16.4.2007
Где: Kiev

Репутация: 2
Всего: 4

Цитата

<table> - div-обертка для блока

попробуйте указать ширину для div

Цитата

<tr> - div-обертка для строки

!попробуйте для </tr> сделать замену <div class="clr"></div>
выйдет что-то типа

Код


<div><!--/ <tr> -->
     <div class="...">...</div><!--/ <td></td> -->
     <div class="...">...</div><!--/ <td></td> -->
     <div class="...">...</div><!--/ <td></td> -->
     <div class="...">...</div><!--/ <td></td> -->
     <div class="...">...</div><!--/ <td></td> -->

    <div class="clr"></div>    
</div>

Код


.clr {
    clear:both;
    font-size:0;
    height:0;
    line-height:0;
    margin:0;
    padding:0;
}

Цитата

<td> - div'ы с float:left

для каждого должна быть указана ширина. Это так? Если ширина не фиксирована (в ед. изм. или процентах то отдельный случай)

Marchello2005

Дата 11.10.2010, 08:55 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 4
Регистрация: 9.10.2010

Репутация: нет
Всего: нет

Цитата

Цитата

<td> - div'ы с float:left

для каждого должна быть указана ширина. Это так? Если ширина не фиксирована (в ед. изм. или процентах то отдельный случай)

Нет ширина не фиксирована. Я сделал как Вы написали пункты меню вышли один под другим

KuZyagroup

Дата 11.10.2010, 15:21 (ссылка)

(нет голосов)

Загрузка ...

magento solution

Профиль
Группа: Участник
Сообщений: 283
Регистрация: 16.4.2007
Где: Kiev

Репутация: 2
Всего: 4

Цитата

Нет ширина не фиксирована.

выход 1:
http://www.quirksmode.org/css/display.html#table
не поддерживает ie6, ie7

выход 2:
определить таки ширину, можно в пикселях, можно в процентах

выход 3:
переписать php код что-бы столбик был в одном div и потом шаманить с бубном

Цитата

Я сделал как Вы написали пункты меню вышли один под другим

странно, должно быть чуть-чуть иначе, есть ссылка на сайт?

Marchello2005

Дата 11.10.2010, 15:56 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 4
Регистрация: 9.10.2010

Репутация: нет
Всего: нет

Да вот, http://www.salsadominicana.com.ua/latino-dance

да я вот шаманю шаманю, а оно не выходит нормально. Благодарю за помощь.

KuZyagroup

Дата 11.10.2010, 17:37 (ссылка)

(нет голосов)

Загрузка ...

magento solution

Профиль
Группа: Участник
Сообщений: 283
Регистрация: 16.4.2007
Где: Kiev

Репутация: 2
Всего: 4

тю
<table> => <div> css height:42px;

<td class="cmenu_hd_gap"></td>
<td class="%s1"> </td>
<td class="%s2" id="%s3">%s4</td>
<td class="%s5"> </td>
<td class="cmenu_hd_gap"></td>

=>

<div class="div_td %s0" id="%s3">%s4</div>

Код


.div_td{
background:url("../images/layout/menu_norm_left.gif") no-repeat left top transparent;
float:left;
}

.div_td a{
background:url("../images/layout/menu_norm_right.gif") no-repeat right top transparent;
line-height:42px;
padding:0 12px;
}

div_td-active. a{ color:#...; }

и после последнего пункта меню

<div class="clr"></div>

то что я написал, подано в форме идеи. Рабочей и проверенной тысячу раз. Если что-то сразу не заработает, изучайте и редактируйте css в firebug в firefox.
Для моей идеи придется, чуть подредактировать фон.

В общем изучайте

п.с. %s0 должен принимать div_td-active в случае если это активный пункт меню.

Это сообщение отредактировал(а) KuZyagroup - 11.10.2010, 17:38

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »