Actually It works, but there was somethin wrong in media query sizes.
thx
Rose
Il giorno venerdì 11 marzo 2016 14:03:05 UTC+1, Rose ha scritto:
>
> Hi,
>
> I need to use "@media screen" to display different background image sizes.
> I was able to reproduce the correct output by using this code with wagtail
> tags:
>
> <style>
> {% image block.value width-1450 as carouselimagedata %}
> @media screen and (min-width:1450px){
> .img { background:url('{{ MEDIA_URL }}{{ carouselimagedata.url }}')
> no-repeat center center; background-size: cover;}
> }
> {% image block.value width-1200 as carouselimagedata %}
> @media screen and (min-width:1200px){
> .img { background:url('{{ MEDIA_URL }}{{ carouselimagedata.url }}')
> no-repeat center center; background-size: cover;}
> } .......
> </style>
>
> output:
>
>
> <style>
>
> @media screen and (min-width:1450px){
> .img { background:url('/media/images/albergo_DPbX2EO.width-1450.jpg')
> no-repeat center center; background-size: cover;}
> }
>
> @media screen and (min-width:1200px){
> .img { background:url('/media/images/albergo_DPbX2EO.width-1200.jpg')
> no-repeat center center; background-size: cover;}
> }
>
> @media screen and (min-width:992px){
> .img { background:url('/media/images/albergo_DPbX2EO.width-992.jpg')
> no-repeat center center; background-size: cover;}
> }
>
> @media screen and (min-width:768px){
> .img { background:url('/media/images/albergo_DPbX2EO.width-800.jpg')
> no-repeat center center; background-size: cover;}
> }
>
> @media screen and (min-width:767px){
> .img { background:url('/media/images/albergo_DPbX2EO.width-550.jpg')
> no-repeat center center; background-size: cover;}
> }
> </style>
>
> I can see background image but it doesn't change in responsive layout
> view. It always seems to pick up the last image size, in my case 550.jpg.
>
> Any ideas?
>
> Thx,
> Rose
>
--
You received this message because you are subscribed to the Google Groups
"Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to django-users+unsubscr...@googlegroups.com.
To post to this group, send email to django-users@googlegroups.com.
Visit this group at https://groups.google.com/group/django-users.
To view this discussion on the web visit
https://groups.google.com/d/msgid/django-users/e453bac2-d58c-48d5-bc74-3a2f658eb556%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
