Question

正如标题所说，我需要从tumblr博客获取图像并将它们显示在网站上的滑块中，我已经使用jsnon成功获得了tumblr的图像，但现在我需要将它们放入此jQuery滑块中。（http://responsiveslides.com/）

所以我认为这可能会起作用但不会，任何人都知道我该做什么？

任何帮助都会有用！谢谢

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>ResponsiveSlides.js &middot; Responsive jQuery slideshow</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="../responsiveslides.css">
<link rel="stylesheet" href="demo.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="../responsiveslides.min.js"></script>
<script>
// You can also use "$(window).load(function() {"
$(function () {

  // Slideshow 1
  $("#slider1").responsiveSlides({
    maxwidth: 800,
    speed: 800
  });

  // Slideshow 2
  $("#slider2").responsiveSlides({
    auto: false,
    pager: true,
    speed: 300,
    maxwidth: 540
  });

  // Slideshow 3
  $("#slider3").responsiveSlides({
    manualControls: '#slider3-pager',
    maxwidth: 540
  });

  // Slideshow 4
  $("#slider4").responsiveSlides({
    auto: false,
    pager: false,
    nav: true,
    speed: 500,
    namespace: "callbacks",
    before: function () {
      $('.events').append("<li>before event fired.</li>");
    },
    after: function () {
      $('.events').append("<li>after event fired.</li>");
    }
  });

 });
 </script>

<?php
// don't forget to change 'username' to your actual tumblr name
$request = 'http://dafuckinblondie.tumblr.com/api/read/json';
$ci = curl_init($request);
curl_setopt($ci, CURLOPT_RETURNTRANSFER, TRUE);
$input = curl_exec($ci);
// Tumblr JSON doesn't come in standard form, some str replace needed
$input = str_replace('var tumblr_api_read = ','',$input);
$input = str_replace(';','',$input);
// parameter 'true' is necessary for output as PHP array
$value = json_decode($input, true);
$content =  $value['posts'];
// the number of items you want to display
$item = 50;
// Tumblr provides various photo size, this case will choose the 75x75 square one
$type = 'photo-url-500';
for ($i=0;$i<=$item;$i++) {
    if ($content[$i]['type'] == 'photo') {
        $fotos ='<img src="' . $content[$i][$type] . '" width="500" hspace="3" alt="' . $content[$i][''] . '" >';
     }
}

?>


<body>
 <div id="wrapper">
    <h1>ResponsiveSlides.js</h1>
    <h2>Simple &amp; lightweight responsive slideshow plugin (in 1kb)</h2>



<!-- Slideshow 1 -->
<ul class="rslides" id="slider1">
  <li><?php echo '<img src="' . $fotos . '">' ?> </li>
</ul>



<!-- This is here just to demonstrate the callbacks -->
<ul class="events">
  <li><h3>Example 4 callback events</h3></li>
</ul>



<a href="http://responsiveslides.com/" id="download">See the documentation</a>
<p class="footer">ResponsiveSlides.js is created by <a     href="http://viljamis.com">@viljamis</a>. It's released under the MIT license. If you have any questions or feedback you can use the <a href="https://github.com/viljami/ResponsiveSlides.js">GitHub project page</a>.</p>
 </div>
</body>
</html>

用json从tumblr获取图像并将它们显示到jQuery滑块中？

0 个答案: