Discussion :

[ickyknox]

Bonjour,

Sur ce site :
http://www.dannaprod.com/index.php?static1/videos

sur PC l'affichage des vidéos est correct. Par contre sur iPhone, les vidéos sont affichées en liste. Je ne comprends pas pourquoi cet affichage est différent.

Pourriez-vous m'aider s'il vous plait ? Je vous remercie.

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
 
.fleft p { font-size: 1.2em; }
 
 
.fleft ul li { display: inline;
}
 
 
.fleft { float: left; margin: 0 20px 30px 0;
}
 
.cboth { clear: both; }
 
#main {
	margin: 0 auto;
	padding: 30px;
	width: 952px;
 
}
 
.fleft ul li img{
	border:7px solid #808AA3;
	-webkit-transition: all 0.4s ease-in-out; 
        -webkit-transition-duration: 0.4s;
	-moz-transition: all 0.4s ease-in-out; 
        -moz-transition-duration: 0.4s;	
	-o-transition: all 0.4s ease-in-out; 
        -o-transition-duration: 0.4s;
	-ms-transition: all 0.4s ease-in-out; 
        -ms-transition-duration: 0.4s;
	-khtml-transition: all 0.4s ease-in-out; 
        -khtml-transition-duration: 0.4s;
}	
 
.fleft ul li img:hover , .fleft .active img {
border:7px solid #333333;}

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<div id="main">
	<div class="fleft">
		<h4>REPORTAGES</h4>
		<ul class="gallery clearfix">
			<li><a href="http://vimeo.com/8851520#at=0" rel="prettyPhoto" title="YouTube demo"><img src="http://dannaprod.com/themes/defaut/diapo/images/thumbnails/001.png" alt="" /></a></li>
			<li><a href="http://youtu.be/HTqYfV9qmXA" rel="prettyPhoto" title="YouTube demo"><img src="http://dannaprod.com/themes/defaut/diapo/images/thumbnails/002.png" alt="" /></a></li>
			<li><a href="http://youtu.be/cH1KNPQE4gU" rel="prettyPhoto" title="YouTube demo"><img src="http://dannaprod.com/themes/defaut/diapo/images/thumbnails/003.png" alt="" /></a></li>                  
		</ul>
	</div>
 
	<div class="fleft">
		<h4>COURTS METRAGES</h4>
		<ul class="gallery clearfix">
			<li><a href="http://youtu.be/koXS3nFYLns" rel="prettyPhoto" title="YouTube demo"><img src="http://dannaprod.com/themes/defaut/diapo/images/thumbnails/004.png" alt="" /></a></li>
			<li><a href="http://vimeo.com/10353921#at=0" rel="prettyPhoto" title="YouTube demo"><img src="http://dannaprod.com/themes/defaut/diapo/images/thumbnails/005.png" alt="" /></a></li>
		</ul>
	</div>
 
	<div class="fleft">
		<h4>MASHUPS</h4>
		<ul class="gallery clearfix">
			<li><a href="http://youtu.be/Um3lRcZd0iI" rel="prettyPhoto" title="YouTube demo"><img src="http://dannaprod.com/themes/defaut/diapo/images/thumbnails/006.png" alt="" /></a></li>
			<li><a href="http://youtu.be/TqV9APlpn0Q" rel="prettyPhoto" title="YouTube demo"><img src="http://dannaprod.com/themes/defaut/diapo/images/thumbnails/007.png" alt="" /></a></li>
			<li><a href="http://youtu.be/yv1cHRBRoPo" rel="prettyPhoto" title="YouTube demo"><img src="http://dannaprod.com/themes/defaut/diapo/images/thumbnails/008.png" alt="" /></a></li>
		</ul>
	</div>
 
	<div class="fleft">
		<h4>PARTENAIRES</h4>
		<ul class="gallery clearfix">
			<li><a href="http://youtu.be/SgMQm4X9ZhQ" rel="prettyPhoto" title="YouTube demo"><img src="http://dannaprod.com/themes/defaut/diapo/images/thumbnails/006.png" alt="" /></a></li>
			<li><a href="http://youtu.be/dr_u3OAfyOg" rel="prettyPhoto" title="YouTube demo"><img src="http://dannaprod.com/themes/defaut/diapo/images/thumbnails/007.png" alt="" /></a></li>
		</ul>
	</div>
 
	<div class="fleft">
		<h4>PUBLICITÉS</h4>
		<ul class="gallery clearfix">
			<li><a href="http://youtu.be/JqLeINjbg0c" rel="prettyPhoto" title="YouTube demo"><img src="http://dannaprod.com/themes/defaut/diapo/images/thumbnails/006.png" alt="" /></a></li>
			<li><a href="http://youtu.be/JqLeINjbg0c" rel="prettyPhoto" title="YouTube demo"><img src="http://dannaprod.com/themes/defaut/diapo/images/thumbnails/007.png" alt="" /></a></li>
		</ul>
	</div>
 
	<br class="cboth" />
 
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
        $("area[rel^='prettyPhoto']").prettyPhoto();
                                
        $(".gallery:first a[rel^='prettyPhoto']").prettyPhoto({animation_speed:'normal', });
        $(".gallery:gt(0) a[rel^='prettyPhoto']").prettyPhoto({animation_speed:'fast', hideflash: true});
        $("#custom_content a[rel^='prettyPhoto']:first").prettyPhoto({
                        custom_markup: '<div id="map_canvas" style="width:260px; height:265px"></div>',
                        changepicturecallback: function(){ initialize(); }
        });
 
        $("#custom_content a[rel^='prettyPhoto']:last").prettyPhoto({
                        custom_markup: '<div id="bsap_1259344" class="bsarocks bsap_d49a0984d0f377271ccbf01a33f2b6d6"></div><div id="bsap_1237859" class="bsarocks bsap_d49a0984d0f377271ccbf01a33f2b6d6" style="height:260px"></div><div id="bsap_1251710" class="bsarocks bsap_d49a0984d0f377271ccbf01a33f2b6d6"></div>',
                        changepicturecallback: function(){ _bsap.exec(); }
        });
});
</script>
 
</div>

[config]Mac OS X Mountain Lion (10.8.2) / Chrome 24.0.1312.57[/config]

[rodolphebrd]

Bonjour,

sur Iphone4 pas de différence.

[ickyknox]

ca fonctionne ! merci !