You need to be logged in to post in the forum - Log In
An active JCE Pro Subscription is required to post in the forum - Buy a Subscription
- Support
- Forum
- JCE Editor
- Responsive width size
Support is currently Online
Official support hours:
Monday To Friday
From 09:00 To 17:00 Europe/London (BST)
From 09:00 To 17:00 Europe/London (BST)
Hello,
I am trying to make some images responsive to work in the larger phones like the Iphone 7 and Iphone 7 plus.
I have determined that an image of a width of 380 works on these phones. But when I enter 380 in the width column in the responsive tab, it won't allow me to Update. It only allows me to update if I use the pixel width ratio.
Why doesn't the Update button work with just a width?
Please see my screenshot for my parameters.
Thanks, Chuck
I am trying to make some images responsive to work in the larger phones like the Iphone 7 and Iphone 7 plus.
I have determined that an image of a width of 380 works on these phones. But when I enter 380 in the width column in the responsive tab, it won't allow me to Update. It only allows me to update if I use the pixel width ratio.
Why doesn't the Update button work with just a width?
Please see my screenshot for my parameters.
Thanks, Chuck
Hello,
Even the Update button doesn't work. If I close the window the code is in there. I am trying to get it to work in the Iphone 7 plus but there is no change. It is my understanding with the way I have it set up. I have an image that is 380 pixels wide that will show at 100vw. Is that correct? It should show on all devices? What is the viewport ratio for an iphone 7 plus?
Thanks, Chuck
<a href="images/place/bonner-milltown2008.jpg" class="jcepopup" data-mediabox="1"><img src="images/place/bonner-milltown2008.jpg" sizes="100vw" srcset="images/place/bonner-milltown2008-ph.jpg 380w" alt="bonner milltown2008" width="350" height="258" style="float: right;" data-mce-popup="1" /></a>
Even the Update button doesn't work. If I close the window the code is in there. I am trying to get it to work in the Iphone 7 plus but there is no change. It is my understanding with the way I have it set up. I have an image that is 380 pixels wide that will show at 100vw. Is that correct? It should show on all devices? What is the viewport ratio for an iphone 7 plus?
Thanks, Chuck
<a href="images/place/bonner-milltown2008.jpg" class="jcepopup" data-mediabox="1"><img src="images/place/bonner-milltown2008.jpg" sizes="100vw" srcset="images/place/bonner-milltown2008-ph.jpg 380w" alt="bonner milltown2008" width="350" height="258" style="float: right;" data-mce-popup="1" /></a>
more than a month ago
·
#94044
iPhone 7 Plus Viewport
414 x 736 PX
~ 134 Pixels Per Inch
You can easily detect your device CSS width and height by single clicking this link: http://viewportsizes.com/mine/
For iPhone 6 its 375px X 667px
For iPhone 6+ its 414px X 736px
For iPhone 7 its 375px X 667px
For iPhone 7+ its 414px X 628px
414 x 736 PX
~ 134 Pixels Per Inch
You can easily detect your device CSS width and height by single clicking this link: http://viewportsizes.com/mine/
For iPhone 6 its 375px X 667px
For iPhone 6+ its 414px X 736px
For iPhone 7 its 375px X 667px
For iPhone 7+ its 414px X 628px
@bolete - I'm not seeing any issues with this on the demo site - https://demo.joomlacontenteditor.net/
Do you have the latest version of the editor installed?
Do you have the latest version of the editor installed?
Just because you're not paranoid doesn't mean everybody isn't out to get you.
Hello,
I am using the lastest version of JCE Editor. And still the update button doesn't work when I change the width parameter. I just updated the width to 480, the button didn't work, but when I closed the window and looked at the code, the 480w was in the code. That's one issue.
But overall, I am not seeing any changes. I have checked an Iphone 7 and a Nexus phone. Do I have to enter a viewport ratio? And if so, from your example above do I calculate the viewport for the Iphone 7+ by taking 628 divided by 414 = 1.516908. And then using 1.5?
I am also looking at the webpage on this website, and the view of 480 is the error I am trying to correct. The word "The" is to the right of the photo.
http://mattkersley.com/responsive/
Here again is the page I am working on.....
http://www.friendsof2rivers.org/bonner/index.php?option=com_content&view=article&id=120&Itemid=485
Thanks for all the help, I hope this helps others too.
Much appreciated,
Chuck
I am using the lastest version of JCE Editor. And still the update button doesn't work when I change the width parameter. I just updated the width to 480, the button didn't work, but when I closed the window and looked at the code, the 480w was in the code. That's one issue.
But overall, I am not seeing any changes. I have checked an Iphone 7 and a Nexus phone. Do I have to enter a viewport ratio? And if so, from your example above do I calculate the viewport for the Iphone 7+ by taking 628 divided by 414 = 1.516908. And then using 1.5?
I am also looking at the webpage on this website, and the view of 480 is the error I am trying to correct. The word "The" is to the right of the photo.
http://mattkersley.com/responsive/
Here again is the page I am working on.....
http://www.friendsof2rivers.org/bonner/index.php?option=com_content&view=article&id=120&Itemid=485
Thanks for all the help, I hope this helps others too.
Much appreciated,
Chuck
I am using the lastest version of JCE Editor. And still the update button doesn't work when I change the width parameter. I just updated the width to 480, the button didn't work, but when I closed the window and looked at the code, the 480w was in the code. That's one issue.
Please send me a login - https://www.joomlacontenteditor.net/contact/site-login
Just because you're not paranoid doesn't mean everybody isn't out to get you.
I am using the lastest version of JCE Editor. And still the update button doesn't work when I change the width parameter. I just updated the width to 480, the button didn't work, but when I closed the window and looked at the code, the 480w was in the code. That's one issue.
I have fixed this issue on your site with an install of JCE Pro 2.6.21 RC2 - https://www.joomlacontenteditor.net/downloads/editor/item/jce-pro-dev
Just because you're not paranoid doesn't mean everybody isn't out to get you.
Hi Ryan,
I am still trying to get the responsive widths to work. Do they work when you have a caption? And do they work when you use the JCE Popup?
No matter what I do I am not seeing any change on the Iphone 7. I still have the word The to the left of the image.
See screenshots for my settings.
Thanks for all the help and Happy New Year.
I am still trying to get the responsive widths to work. Do they work when you have a caption? And do they work when you use the JCE Popup?
No matter what I do I am not seeing any change on the Iphone 7. I still have the word The to the left of the image.
See screenshots for my settings.
Thanks for all the help and Happy New Year.
Unfortunately an image will not be responsive if it has a caption which is aligned left or right (a float:left or float:right style).
Also, if you are using the Responsive tab to set the display of different sized images based on the device, then the caption might limit the display size of images bigger than the original, as the caption structure requires a max-width to be set.
FYI - When using the Responsive tab, you need to set each Source as a different sized image, otherwise there is no point in using it.
Also, if you are using the Responsive tab to set the display of different sized images based on the device, then the caption might limit the display size of images bigger than the original, as the caption structure requires a max-width to be set.
FYI - When using the Responsive tab, you need to set each Source as a different sized image, otherwise there is no point in using it.
Just because you're not paranoid doesn't mean everybody isn't out to get you.
- Page :
- 1
There are no replies made for this post yet.
Be one of the first to reply to this post!
Be one of the first to reply to this post!