XOOPS 
Forum
Forum Index General Forums Community Support Modules Support Themes Support Development International Support Module Hack Reviews Theme Designer Talk
  1. Board index / 
  2. XOOPS Community Support forums / 
  3. 2.5.x Support 
  4.  / Automatic image width (for mobile devices)
Register
1
Hadesteam
Automatic image width (for mobile devices)

  • 2017/4/24 15:22

  • Hadesteam

  • Not too shy to talk

  • Posts: 162

  • Since: 2011/9/5 1


I have quite wide advertising banners on http://www.kulturystyka.org.pl. When I go on the phone, they do not automatically adjust to the width of the screen .... How to change it?

What is the best practice for everyone, no matter what device they use, have pictures displayed in the correct form?
I tried to add to the <img src = "tag width =" 100% but it only worked for the banner under the article (news module) but in the block at the top of the banner instead of expanding it decreased ...

Please help how to systematically solve it?
Regards
2
Bleekk
Re: Automatic image width (for mobile devices)

  • 2017/4/24 16:12

  • Bleekk

  • Theme Designer

  • Posts: 942

  • Since: 2002/12/14


le="color: #000000"><?php <img src="..." class="img-responsive">
3
Hadesteam
Re: Automatic image width (for mobile devices)

  • 2017/4/24 16:22

  • Hadesteam

  • Not too shy to talk

  • Posts: 162

  • Since: 2011/9/5 1


le="color: #000000"><?php .width100 { width: 100%;}


le="color: #000000"><?php <a href="http://www.sfd.pl/sklep/prdir.aspx?pid=20" target="_blank"><img class="width100" src="http://www.kulturystyka.org.pl/images/baner_sfd_650.gif"> </a>


Look at this and first baner top left why is smaller than before but banner under article is resizing 100% ?
http://www.kulturystyka.org.pl/modules/news/article.php?storyid=1122
4
Bleekk
Re: Automatic image width (for mobile devices)

  • 2017/4/24 19:09

  • Bleekk

  • Theme Designer

  • Posts: 942

  • Since: 2002/12/14


first your fb comments are not responsive
and second please use the bootstrap class img-responsive for all images on your website
5
Hadesteam
Re: Automatic image width (for mobile devices)

  • 2017/4/24 20:32

  • Hadesteam

  • Not too shy to talk

  • Posts: 162

  • Since: 2011/9/5 1


Ok thank you for the information, and could you give an example? How do you explain to me I will know how to change all the pictures on the site ... I see something like this:

le="color: #000000"><?php .widthauto { width: auto;} .width100 { width: 100%;} .width90 { width: 90%} .width80 { width: 80%;} .width75 { width: 75%;} .width70 { width: 70%} .width66 { width: 66.6%} .width60 { width: 60%} .width50 { width: 49%;} .width45 { width: 45%} .width40 { width: 40%} .width33 { width: 33.3%;} .width30 { width: 30%;} .width25 { width: 25%;} .width20 { width: 20%;} .width15 { width: 15%;} .width10 { width: 10%;} .width5{ width: 5%; } .width3{ width: 3%; } .width2{ width: 2%; } .width1{ width: 1%; }


Can you change the code below, but these 2 banners were fully responsive on all devices? (I'll just change the responsiveness of FB comments). If i find where it changes ... Please advice.

le="color: #000000"><?php <center> <a href="http://www.sfd.pl/sklep/prdir.aspx?pid=20"><img class="width100" src="/reklama/baner_poziomy_dol_sfd.jpg"></a> <a href="http://www.taniesuple.com/" target="_blank"><img src="http://www.kulturystyka.org.pl/reklama/TanieSuple_com_730x100_.jpg"></a></center>
6
Bleekk
Re: Automatic image width (for mobile devices)

  • 2017/4/24 20:50

  • Bleekk

  • Theme Designer

  • Posts: 942

  • Since: 2002/12/14


i explained it in my first answer. post #2
7
Hadesteam
Re: Automatic image width (for mobile devices)

  • 2017/4/24 20:58

  • Hadesteam

  • Not too shy to talk

  • Posts: 162

  • Since: 2011/9/5 1


I am a heavy case .... hehe;)

le="color: #000000"><?php widthauto
i try and tell You if something change for better
8
Zap_English
Re: Automatic image width (for mobile devices)

Quote:

Bleekk wrote:
le="color: #000000"><?php <img src="..." class="img-responsive">


So you put class="img-responsive" in every image link?
9
aerograf
Re: Automatic image width (for mobile devices)

  • 2017/4/25 6:47

  • aerograf

  • Quite a regular

  • Posts: 214

  • Since: 2017/1/7 1


As far as I remember, resizing depending on the screen: max-width: 100%;
10
Hadesteam
Re: Automatic image width (for mobile devices)

  • 2017/4/25 11:31

  • Hadesteam

  • Not too shy to talk

  • Posts: 162

  • Since: 2011/9/5 1


That's right ... lol, then I may not be writing anything yet ....


... stupid hades, stupid hades ...
(1) 2 3 4 5 »

Login

Register now!  |  Lost Password?

Search

Advanced Search

Recent Posts

Donat-O-Meter

Stats
Goal: $15.00
Due Date: Jul 31
Gross Amount: $0.00
Net Balance: $0.00
Left to go: $15.00
Make donations with PayPal!

Latest GitHub Commits