Não sei exatamente se estou postando no local correto do forum, mas se não estiver favor o moderador mover o tópico.
Utilizo o Nivo Slider no meu blog para colocar artigos em destaques, mas troquei meu template por um que já vem com o Nivo Slider instalado. A área da imagem e de 920px por 400px, mas as imagens não estão sendo redimensionamento para caber no local, se ela for mais que a área ela fica cortada e se for menor fica aparecendo no canto. Gostaria de saber como fazer para redimensionar as imagens automaticamente. O blog afetado e ess: http://www.aprendaavalorizar.com.br/
Pergunta
Lionardy Angel
Olá!
Não sei exatamente se estou postando no local correto do forum, mas se não estiver favor o moderador mover o tópico.
Utilizo o Nivo Slider no meu blog para colocar artigos em destaques, mas troquei meu template por um que já vem com o Nivo Slider instalado. A área da imagem e de 920px por 400px, mas as imagens não estão sendo redimensionamento para caber no local, se ela for mais que a área ela fica cortada e se for menor fica aparecendo no canto. Gostaria de saber como fazer para redimensionar as imagens automaticamente. O blog afetado e ess: http://www.aprendaavalorizar.com.br/
O código de configuração do Nivo Slider e esse:
.fullslider{position:relative;width:100%;height:400px;overflow:hidden}
.fullslider_content{position:absolute;top:0;left:50%;margin-left:-960px;width:1920px;height:400px}
.fullslider .nivoSlider{position:relative;width:1920px !important;height:400px !important}
.fullslider .nivo-caption{position:absolute;left:0;bottom:0;background:#000;color:#fff;opacity:0.8;z-index:8;text-align:center;width:100%;padding-bottom:40px;font-size:16px}
.fullslider .nivo-directionNav a{position:absolute;top:50%;z-index:9;margin-top:-30px;cursor:pointer;width:40px;height:60px;text-indent:-9999px}
.fullslider .nivo-prevNav{left:50%;margin-left:-460px}
.fullslider .nivo-nextNav{right:50%;margin-right:-460px}
.fullslider .nivo-controlNav{position:absolute;left:50%;bottom:10px;margin-left:-140px;z-index:4000;width:280px;text-align:center}
.nivoSlider{position:relative;width:920px;height:400px;margin:0 auto}
.slider_padding{padding:20px 0}
.nivoSlider img{position:absolute;top:0;left:0}
.nivoSlider a{display:block}
.nivoSlider a.nivo-imageLink{position:absolute;top:0;left:0;width:100%;height:100%;border:0;padding:0;margin:0;z-index:6;display:none}
.nivo-slice{display:block;position:absolute;z-index:5;height:100%}
.nivo-box{display:block;position:absolute;z-index:5}
.nivo-caption{position:absolute;left:0;bottom:0;background:#000;color:#fff;opacity:0.8;width:100%;z-index:8}
.nivo-caption p{padding:5px;margin:0}
.nivo-caption a{display:inline !important}
.nivo-html-caption{display:none}
.nivo-directionNav a{position:absolute;top:50%;z-index:9;margin-top:-30px;cursor:pointer;width:40px;height:60px;text-indent:-9999px}
.nivo-prevNav{background:url(https://lh3.googleusercontent.com/-9pnR3vz91J0/UHOS_-w8CcI/AAAAAAAAEE8/T_zcNwAGkSQ/s80/slider_arrow.png) no-repeat left top;left:0}
.nivo-nextNav{background:url(https://lh3.googleusercontent.com/-9pnR3vz91J0/UHOS_-w8CcI/AAAAAAAAEE8/T_zcNwAGkSQ/s80/slider_arrow.png) no-repeat right top;right:0}
.nivo-controlNav{position:absolute;right:10px;bottom:10px;z-index:4000;width:100%;text-align:right}
.nivo-controlNav a{display:inline-block !important;width:18px;height:18px;background:url(https://lh5.googleusercontent.com/--gtK-xeQuCM/UHOS8jJ3_yI/AAAAAAAAEDs/Pr9i4nj8tSU/s36/bullets.png) no-repeat left top;text-indent:-9999px;border:0;cursor:pointer;text-align:left}
.nivo-controlNav a.active{background-position:right top}
E o código de configuração da imagem e esse:
<div class='nivoSlider' id='nivo_slider'>
<a href='#'><img height='400' src='https://lh3.googleusercontent.com/-pTjMUPADe0I/UHOS7nspVgI/AAAAAAAAEDY/E2xf6zXFlBY/s920/1.jpg' title='This is an example caption' width='920'/></a>
<a href='#'><img height='400' src='https://lh5.googleusercontent.com/-hTLiTNGZgTs/UHOS8LVxrBI/AAAAAAAAEDg/PUtBLSVvT-I/s920/2.jpg' title='This is an example caption' width='920'/></a>
<a href='#'><img height='400' src='https://lh3.googleusercontent.com/-olOaY59Winw/UHOS8B3TyOI/AAAAAAAAEDc/gQAgxZOSd44/s920/3.jpg' title='This is an example caption' width='920'/></a>
</div>
Tenho certeza que não e o código da imagem pois já usei o mesmo código em outros templates.
Link para o comentário
Compartilhar em outros sites
0 respostass a esta questão
Posts Recomendados
Participe da discussão
Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.