The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Mobile version and viewing images.

View previous topic View next topic Go down

Solved Mobile version and viewing images.

Post by Keltic on August 17th 2015, 1:56 pm

Just a quick fire question really, is there any code that allows u to see images in the mobile version rather than just a link ? I've looked around but so far eludes me.


Last edited by Keltic on August 18th 2015, 11:01 pm; edited 1 time in total

Keltic
Forumember

Male Posts : 58
Reputation : 6
Language : English

http://generation8gaming.forumotion.com

Back to top Go down

Solved Re: Mobile version and viewing images.

Post by Ange Tuteur on August 17th 2015, 2:51 pm

Hi @Keltic,

I never thought of that, but it should be rather easy. Smile

Go to Modules > JavaScript codes management > Create a new script

Placement : In the topics
Code:
$(function() {
  if (!_userdata.page_desktop) return;
  for (var a = document.getElementsByTagName('A'), i = 0, j = a.length; i < j; i++) {
    if (/img_link/.test(a[i].className)) {
      a[i].removeAttribute('class');
      a[i].innerHTML = '<img src="' + a[i].href + '" alt="' + a[i].innerHTML + '" />';
    }
  }
});

Save, then the script should automatically identify the correct links and change their content to an image.

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2684
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Mobile version and viewing images.

Post by Keltic on August 17th 2015, 6:05 pm

Thanks Ange, that worked well, now just to make things a bit more difficult can we in some way limit the size of image shown to screen size, at the minute the image is pushed out side of page.

Keltic
Forumember

Male Posts : 58
Reputation : 6
Language : English

http://generation8gaming.forumotion.com

Back to top Go down

Solved Re: Mobile version and viewing images.

Post by Ange Tuteur on August 17th 2015, 6:47 pm

Oh yes, I hadn't thought of that. It would be best to replace the JavaScript with the following :
Code:
$(function() {
  if (!_userdata.page_desktop) return;
  for (var a = document.getElementsByTagName('A'), i = 0, j = a.length; i < j; i++) {
    if (/img_link/.test(a[i].className)) {
      a[i].removeAttribute('class');
      a[i].innerHTML = '<img class="mobile_image" src="' + a[i].href + '" alt="' + a[i].innerHTML + '" />';
    }
  }
});
( or add the class mobile_image to the image element )

Then add this to your CSS stylesheet :
( Display > Colors > CSS stylesheet )
Code:
.mobile_image { max-width:99% }

If the image exceeds 99% of the parent container it'll be resized. You can adjust the percent as necessary, but it shouldn't matter too much if it's small since you can still click the image to see its full size. Wink

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2684
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Mobile version and viewing images.

Post by Keltic on August 17th 2015, 8:44 pm

Works brilliantly, can we do something similar for youtube videos

Keltic
Forumember

Male Posts : 58
Reputation : 6
Language : English

http://generation8gaming.forumotion.com

Back to top Go down

Solved Re: Mobile version and viewing images.

Post by Keltic on August 18th 2015, 4:49 pm

Hello ho .... Nicer than just a bump groar

Keltic
Forumember

Male Posts : 58
Reputation : 6
Language : English

http://generation8gaming.forumotion.com

Back to top Go down

Solved Re: Mobile version and viewing images.

Post by SLGray on August 18th 2015, 7:00 pm

Yesterday at 1:44 pm
Today at 9:49 am

Second Reminder:

Please don't double post. Your post needs to be separated by at least 24 hours before bumping. Please use the edit button instead!


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 35670
Reputation : 2375
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

Solved Re: Mobile version and viewing images.

Post by Ange Tuteur on August 18th 2015, 8:15 pm

@Keltic wrote:Works brilliantly, can we do something similar for youtube videos
Sorry for the late reply, yes it's possible. Add the following rule to your stylesheet :
Code:
#mpage-body .post embed {
  max-width:99% !important;
  height:auto !important;
}

You can remove the height declaration if you want it to render the default height. Otherwise the height is automatically calculated to be in proportion with the width.

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2684
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Mobile version and viewing images.

Post by Guest on August 18th 2015, 8:37 pm

What is your Forum URL? btw?

Guest
Guest


Back to top Go down

Solved Re: Mobile version and viewing images.

Post by Ange Tuteur on August 18th 2015, 8:51 pm

Ghost wrote:What is your Forum URL? btw?
You can find your answer on what an URL is here.

Next time, please avoid asking questions in other users topics that are not related to the support question. If you have a question of your own, it's best to open your own topic.

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2684
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Mobile version and viewing images.

Post by Keltic on August 18th 2015, 11:01 pm

@Ange Tuteur wrote:
@Keltic wrote:Works brilliantly, can we do something similar for youtube videos
Sorry for the late reply, yes it's possible. Add the following rule to your stylesheet :
Code:
#mpage-body .post embed {
 max-width:99% !important;
 height:auto !important;
}

You can remove the height declaration if you want it to render the default height. Otherwise the height is automatically calculated to be in proportion with the width.
Brilliant, many thanks for all your assist, been greatly appreciated.

Keltic
Forumember

Male Posts : 58
Reputation : 6
Language : English

http://generation8gaming.forumotion.com

Back to top Go down

Solved Re: Mobile version and viewing images.

Post by SLGray on August 19th 2015, 7:12 am

Topic solved and archived


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 35670
Reputation : 2375
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum