2013-02-16 79 views
1

我想設置這樣一個ListView:圖像大小的ListView jquerymobile

http://jquerymobile.com/demos/1.2.0/docs/lists/lists-thumbnails.html

我dinamicly生成我的代碼

$('#calendarPage').live('pagebeforeshow', function(event) { 
    $('#calendarPage').live('pageshow', function(event) { 
     application.prev = 'menu.html'; 
     //get the actu 
     application.readFile('calendar.json',function(data){ 
      data = JSON.parse(data); 

      var listview = '<ul data-role="listview" class="ui-listview" id="calendarList" >'; 
      for(elem in data){ 
       var date = new Date(data[elem].date); 
       var day = date.getDate(); 
       var month = date.getMonth() + 1; 
       var year = date.getYear(); 
       var hours = date.getHours(); 
       var min = date.getMinutes(); 
       var s = date.getSeconds(); 
       listview += '<li>'; 
       listview += '<img src="'+application.api+data[elem].img+'" /><a href="actuOne.html?id='+elem+'" ><h3>'+data[elem].title+'</h3><p>'+day+'/'+month+'/'+year+' '+hours+':'+min+':'+s+'</p></a>'; 
       listview += '</li>'; 
      } 
      listview += '</ul>'; 
      $('#calendarPage .content').html(listview); 
      $('#calendarList').listview(); 
     }); 
    }); 
}); 
創建

YHE列表視圖,但圖像沒有調整

我嘗試添加class =「ui-li-thumb」,但效果不佳

感謝

+0

你能後呈現的代碼? – Omar 2013-02-16 23:41:46

回答

1

有你的榜樣錯誤,IMG標籤必須爲一個標籤內,只有那麼它會被調整。

看看這個例子:http://jsfiddle.net/Gajotres/w5bcS/

 <ul data-role="listview"> 
      <li><a href="index.html"> 
       <img src="http://www.warrenphotographic.co.uk/photography/bigs/05852-Retriever-puppy-yawning-white-background.jpg" title="sample"/> 
       <h3>Sample image</h3> 
       <p>Sample</p> 
      </a></li> 
      <li><a href="index.html"> 
       <img src="http://www.warrenphotographic.co.uk/photography/bigs/05852-Retriever-puppy-yawning-white-background.jpg" title="sample"/> 
       <h3>Sample image</h3> 
       <p>Sample 2</p> 
      </a></li> 
     </ul> 
+1

感謝它現在的作品 – Ajouve 2013-02-17 09:11:13