Member Avatar for Abhishek_26
Abhishek_26 0 Newbie Poster

i have bind 10 random post form json file in to marquee but the problem is arising , its show like list and showing as marquee works kindly check the code and the output , do some suggestion what to do .

Thanks in advance

<html> <head> <meta charset="UTF-8"> <title>Sabkideal.com Todays findmystay.com</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="bootstrap/js/bootstrap.min.js"></script> <!-- Boostarp --> <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css" media="all" /> <!-- Boostrap --> <link rel="stylesheet" href="bootstrap/css/custom.css" media="all" /> <script type="text/javascript">


function disableSelection(target){
if (typeof target.onselectstart!="undefined") //IE route
    target.onselectstart=function(){return false}
else if (typeof target.style.MozUserSelect!="undefined") //Firefox route
    target.style.MozUserSelect="none"
else //All other route (ie: Opera)
    target.onmousedown=function(){return false}
target.style.cursor = "default"
}

//Sample usages
//disableSelection(document.body) //Disable text selection on entire body
//disableSelection(document.getElementById("mydiv")) //Disable text selection on element with id="mydiv"

</script> <style>
.button {
  background-color: #FF5733;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  border: none;
  color: #FFFFFF;
  cursor: pointer;
  display: inline-block;
  font-family: Arial;
  font-size: 20px;
  padding: 5px 10px;
  text-align: center;
  text-decoration: none;
}
@-webkit-keyframes glowing {
  0% { background-color: #B20000; -webkit-box-shadow: 0 0 3px #B20000; }
  50% { background-color: #FF0000; -webkit-box-shadow: 0 0 40px #FF0000; }
  100% { background-color: #B20000; -webkit-box-shadow: 0 0 3px #B20000; }
}

@-moz-keyframes glowing {
  0% { background-color: #B20000; -moz-box-shadow: 0 0 3px #B20000; }
  50% { background-color: #FF0000; -moz-box-shadow: 0 0 40px #FF0000; }
  100% { background-color: #B20000; -moz-box-shadow: 0 0 3px #B20000; }
}

@-o-keyframes glowing {
  0% { background-color: #B20000; box-shadow: 0 0 3px #B20000; }
  50% { background-color: #FF0000; box-shadow: 0 0 40px #FF0000; }
  100% { background-color: #B20000; box-shadow: 0 0 3px #B20000; }
}

@keyframes glowing {
  0% { background-color: #B20000; box-shadow: 0 0 3px #B20000; }
  50% { background-color: #FF0000; box-shadow: 0 0 40px #FF0000; }
  100% { background-color: #B20000; box-shadow: 0 0 3px #B20000; }
}

.button {
  -webkit-animation: glowing 1500ms infinite;
  -moz-animation: glowing 1500ms infinite;
  -o-animation: glowing 1500ms infinite;
  animation: glowing 1500ms infinite;
}
</style> </head> <body> <nav class="navbar navbar-default" role="navigation"> <div class="container-fluid"> <!--header section --> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="index.php">Sabkideal.com  </a> </div> <!-- menu section --> <div class="collapse navbar-collapse navbar-ex1-collapse"> <ul class="nav navbar-nav navbar-right"> <li><a href="# ">Home</a></li> <li><a href="# ">Register and win </a></li> <li><a href="#">Conatct Us </a></li> </ul> </div> </div> </nav> <div style="margin-left: 150px;
     width: 100px; "> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- sabkidealLeaderborad --> <ins class="adsbygoogle"
     style="display:inline-block;width:728px;height:90px"
     data-ad-client="ca-pub-9170404078755708"
     data-ad-slot="9181804474"></ins> <script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script> </div> <div class ="container"> <div class ="row"> <div class="col-lg-2"> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- sabkidealskycraper --> <ins class="adsbygoogle"
     style="display:inline-block;width:160px;height:600px"
     data-ad-client="ca-pub-9170404078755708"
     data-ad-slot="3308237676"></ins> <script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script> </div> <div class="col-lg-8"> <?php
        $c = 0; 

    $ch = curl_init("http://tools.vcommission.com/api/coupons.php?apikey=e159f64e3dd49fddc3bb21dcda70f10c6670ea91aac30c7cb1d4ed37b20c45b8"); // add your url which contains json file
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
    $content = curl_exec($ch);
    curl_close($ch);
    $json = json_decode($content, true);
$randoms = array_rand($json, 10);
$count = count($randoms);



for($i=0;$i<$count;$i++)
{
      echo '<marquee behavior="scroll" LOOP=2 direction="left" onmouseover="this.stop();" onmouseout="this.start();"> <a target="_blank" style="width:100%" rel="nofollow, noindex" href='.$json[$randoms[$i]]['link'].'>
      '.$json[array_rand($json)]['coupon_title'].'</a></marquee><br/>';

}







?> </div> <script type="text/javascript">
var alltables=document.getElementsByTagName("table")
for (var i=0; i<alltables.length; i++)
disableSelection(alltables[i]) //disable text selection within all tables on the page
</script> <div class="col-lg-2"> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- sabkidealskycraper --> <ins class="adsbygoogle"
     style="display:inline-block;width:160px;height:600px"
     data-ad-client="ca-pub-9170404078755708"
     data-ad-slot="3308237676"></ins> <script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script> </div> </div> </div> </body> </html>
  • 1 Contributor
  • 0 Replies
  • 283 Views

Dani AI

Generated

Quick diagnosis and fixes for code

Problem summary: the code prints a separate marquee for each item, so the browser stacks them vertically and they look like a list. Also the title and link can get out of sync because a second call to array_rand picks a different item for the title. Other issues to watch for are unquoted/unsafe href output (invalid HTML or broken links), incorrect rel usage (nofollow, noindex is wrong — rel tokens are space separated; use noopener noreferrer when opening new tabs), and the fact that <marquee> is obsolete and has accessibility problems.

Practical steps (safe, minimal changes)

  • Pick the random items once (shuffle + array_slice, or call array_rand once and reuse those keys) so each title matches its link.
  • Build a single horizontal line of anchors and output a single container (instead of 10 separate marquee elements).
  • Escape user data: use htmlspecialchars for text and filter_var(..., FILTER_SANITIZE_URL) for URLs before printing.
  • Don’t expose API keys in public code; store them in environment variables or server config.
  • Check JSON decoding (json_last_error_msg()) and guard against empty or malformed responses.

Minimal example pattern (concept only — not a copy of the original):

shuffle($json);
$selected = array_slice($json, 0, min(10, count($json)));
foreach ($selected as $item) {
  $url = filter_var($item['link'], FILTER_SANITIZE_URL);
  $title = htmlspecialchars($item['coupon_title'], ENT_QUOTES);
  $parts[] = '<a href="'.$url.'" target="_blank" rel="noopener noreferrer">'.$title.'</a>';
}
echo '<div class="marquee">'.implode(' &nbsp; | &nbsp; ', $parts).'</div>';

If a modern, accessible alternative is preferred, use CSS animation (translateX keyframes) plus prefers-reduced-motion so motion is reduced for users who request it. Finally, inspect the generated HTML in the browser dev tools — if anchors are missing quotes or look malformed, the markup or concatenation is the culprit.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.