0

メディア クエリを使用する CSS スタイルを簡単に生成できるように、カスタム PHP 関数を作成しています。

私の関数は非常に反復的になっていたので、最初の関数内に配置する 2 番目の関数を作成しました。2 番目の関数には、繰り返しコードがすべて含まれていました。

2 番目の関数は、最初の関数からの別の文字列内に挿入されるテキストの文字列を生成します。

ただし、最終的な出力では、2 番目の関数テキスト文字列が最初の関数文字列の外側に配置されていることがわかりました。どうすればこれを修正できますか?

これが私のコードです：

    <?php
function css_bgcolor_height_embded($region, $height_value, $mobile_setting, $mobile_custom_height)
{
    function css_height_output($region, $height_value, $class_prefix, $height_division)
    {
        echo "$class_prefix" . " ." . $region . "-bgcolor-height-source-element {
            height: $height_value" . "px;
            height:" . (($height_value / $height_division) / 10) . "rem;
        }" . "   " . "

        $class_prefix" . " ." . $region . "-bgcolor-height  {
            top:" . "$height_value" . "px;
            top:" . (($height_value / $height_division) / 10) . "rem;
        } ";

    }


    $css_bgcolor_height_embeded .= css_height_output($region, $height_value, '', 1);


    if ($mobile_setting == '50%') {
        $css_bgcolor_height_embeded .= "@media only screen and (min-width: 0px) and (max-width: 959px) {" . css_height_output($region, $height_value, '.submenu-devices', 2) . "}";

        $css_bgcolor_height_embeded .= "@media only screen and (min-width: 0px) and (max-width: 767px) {" . css_height_output($region, $height_value, '.submenu-portables', 2) . "}";

        $css_bgcolor_height_embeded .= css_height_output($region, $height_value, 'submenu-all', 2);


    } elseif ($mobile_setting == 'custom') {
        $css_bgcolor_height_embeded .= "@media only screen and (min-width: 0px) and (max-width: 959px) {" . css_height_output($region, $mobile_custom_height, '.submenu-devices', 2) . "}";

        $css_bgcolor_height_embeded .= "@media only screen and (min-width: 0px) and (max-width: 767px) {" . css_height_output($region, $mobile_custom_height, '.submenu-portables', 2) . "}";

        $css_bgcolor_height_embeded .= css_height_output($region, $mobile_custom_height, '.submenu-all', 2);

    }

    echo $css_bgcolor_height_embeded;
}

echo css_bgcolor_height_embded('header', 10, 'custom', '100');

?>

これが私の出力です:(メディアクエリのコードが間違って外側に配置されています[最後を参照])

.header-bgcolor-height-source-element {
    height: 10px;
    height: 1rem;
}

.header-bgcolor-height {
    top: 10px;
    top: 1rem;
}

.submenu-devices .header-bgcolor-height-source-element {
    height: 100px;
    height: 5rem;
}

.submenu-devices .header-bgcolor-height {
    top: 100px;
    top: 5rem;
}

.submenu-portables .header-bgcolor-height-source-element {
    height: 100px;
    height: 5rem;
}

.submenu-portables .header-bgcolor-height {
    top: 100px;
    top: 5rem;
}

.submenu-all .header-bgcolor-height-source-element {
    height: 100px;
    height: 5rem;
}

.submenu-all .header-bgcolor-height {
    top: 100px;
    top: 5rem;
}
@media only screen and (min-width: 0px) and (max-width: 959px) {
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
}

出力は次のようになります: (メディアクエリのコードはその中に配置する必要があります)

.header-bgcolor-height-source-element {
    height: 10px;
    height: 1rem;
}

.header-bgcolor-height {
    top: 10px;
    top: 1rem;
}


.submenu-all .header-bgcolor-height-source-element {
    height: 100px;
    height: 5rem;
}

.submenu-all .header-bgcolor-height {
    top: 100px;
    top: 5rem;
}
@media only screen and (min-width: 0px) and (max-width: 959px) {

.submenu-devices .header-bgcolor-height-source-element {
    height: 100px;
    height: 5rem;
}

.submenu-devices .header-bgcolor-height {
    top: 100px;
    top: 5rem;
}

}
@media only screen and (min-width: 0px) and (max-width: 767px) {
    .submenu-portables .header-bgcolor-height-source-element {
    height: 100px;
    height: 5rem;
}

.submenu-portables .header-bgcolor-height {
    top: 100px;
    top: 5rem;
}
}

(その後、最終的なコードが Drupal 関数に挿入されます。ただし、これは一般的な PHP の問題であると思われるため、Drupal 要素は省略しました)。

4

2 に答える 2

3

関数で使用echoするcss_height_output代わりに、代わりに return を使用する必要があります。問題は、echo探している文字列に挿入するのではなく、その文字列をすぐに出力することです。

ECHO関数はその時点で、そのテキストを取得してテキストの本文に出力します.returnはそのデータを呼び出したものに送り返します.あなたの場合は$css_bgcolor_height_embeded変数の末尾に追加します.

function css_height_output($region, $height_value, $class_prefix, $height_division)
{
    return "$class_prefix" . " ." . $region . "-bgcolor-height-source-element {
        height: $height_value" . "px;
        height:" . (($height_value / $height_division) / 10) . "rem;
    }" . "   " . "

    $class_prefix" . " ." . $region . "-bgcolor-height  {
        top:" . "$height_value" . "px;
        top:" . (($height_value / $height_division) / 10) . "rem;
    } ";

}
于 2012-12-30T06:57:11.593 に答える
2

代わりにこれを試してください...

<?php
function css_bgcolor_height_embded($region, $height_value, $mobile_setting, $mobile_custom_height)
{
    function css_height_output($region, $height_value, $class_prefix, $height_division)
    {
    return "$class_prefix" . " ." . $region . "-bgcolor-height-source-element {
        height: $height_value" . "px;
        height:" . (($height_value / $height_division) / 10) . "rem;
    }" . "   " . "

    $class_prefix" . " ." . $region . "-bgcolor-height  {
        top:" . "$height_value" . "px;
        top:" . (($height_value / $height_division) / 10) . "rem;
    }\n\n";

    }


    $css_bgcolor_height_embeded = css_height_output($region, $height_value, '', 1);


    if ($mobile_setting == '50%') {
    $css_bgcolor_height_embeded .= "@media only screen and (min-width: 0px) and (max-width: 959px) {" . css_height_output($region, $height_value, '.submenu-devices', 2) . "}";

    $css_bgcolor_height_embeded .= "@media only screen and (min-width: 0px) and (max-width: 767px) {" . css_height_output($region, $height_value, '.submenu-portables', 2) . "}";

    $css_bgcolor_height_embeded .= css_height_output($region, $height_value, 'submenu-all', 2);


    } elseif ($mobile_setting == 'custom') {
    $css_bgcolor_height_embeded .= "@media only screen and (min-width: 0px) and (max-width: 959px) {" . css_height_output($region, $mobile_custom_height, '.submenu-devices', 2) . "}";

    $css_bgcolor_height_embeded .= "@media only screen and (min-width: 0px) and (max-width: 767px) {" . css_height_output($region, $mobile_custom_height, '.submenu-portables', 2) . "}";

    $css_bgcolor_height_embeded .= css_height_output($region, $mobile_custom_height, '.submenu-all', 2);

    }

    return $css_bgcolor_height_embeded;
}

echo css_bgcolor_height_embded('header', 10, 'custom', '100');

?>

echo の代わりに return を使用するように注意してください。Echoは評価時にプリントアウトし、

于 2012-12-30T07:05:54.603 に答える