Error in HTML Slider

Asked

Viewed 105 times

0

Hello! I have an HTML slider and I’m deploying PHP to make it manageable, however, when PHP came in, the slider stopped working. I believe it’s a mistake in the next part of the code:

                echo '<div class="col-md-12" style="top:15px;">';
            echo '<div class="lightbox" data-plugin-options=".{"delegate":"a","gallery":{"enabled":true,"tPrev":"Anterior","tNext":"Pr\u00f3ximo"},"image":{"verticalFit":false}}.">';
            echo '<div class="owl-carousel text-center controlls-over" data-plugin-options=".{"items":1,"singleItem":true,"lazyLoad":true,"navigation":true,"pagination":false,"transitionStyle":"fadeUp","autoHeight":true,"autoPlay":false}.">';
            echo '<div class="item">';

I believe the concatenation is wrong. What to do?

jquery html css

1 answer

6


The problem there is a mixture of quotes in the same HTML part.

A simpler way is to close PHP to fall into pure HTML mode, so you can use single double quotes to separate HTML parameters from JS objects:

<?php
   // ... resto do codigo ...
?>
    <div class="col-md-12" style="top:15px;">
    <div class="lightbox" data-plugin-options="{'delegate':'a','gallery':'enabled':true,'tPrev':'Anterior','tNext':'Pr\u00f3ximo'},'image':{'verticalFit':false}}">
    <div class="owl-carousel text-center controlls-over" data-plugin-options="{'items':1,'singleItem':true,'lazyLoad':true,'navigation':true,'pagination':false,'transitionStyle':'fadeUp','autoHeight':true,'autoPlay':false}">
    <div class="item">
<?php
   // ... resto do codigo ...
?>

Another is to use HEREDOC, if you want to use PHP variables in the future without needing echo:

echo <<<HTML
<div class="col-md-12" style="top:15px;">
<div class="lightbox" data-plugin-options="{'delegate':'a','gallery':'enabled':true,'tPrev':'Anterior','tNext':'Pr\u00f3ximo'},'image':{'verticalFit':false}}">
<div class="owl-carousel text-center controlls-over" data-plugin-options="{'items':1,'singleItem':true,'lazyLoad':true,'navigation':true,'pagination':false,'transitionStyle':'fadeUp','autoHeight':true,'autoPlay':false}">
<div class="item">
HTML;

More details about HEREDOC here:

What use <<< EOH in PHP?

Browser other questions tagged jquery html css

You are not signed in. Login or sign up in order to post.