![]() |
|
Change image size inside iframe - Printable Version +- Hack Forums (https://hackforums.net) +-- Forum: Tech (https://hackforums.net/forumdisplay.php?fid=444) +--- Forum: Webmasters (https://hackforums.net/forumdisplay.php?fid=141) +---- Forum: Website Construction (https://hackforums.net/forumdisplay.php?fid=50) +---- Thread: Change image size inside iframe (/showthread.php?tid=5825851) |
Change image size inside iframe - Ombra - Apr 16, 2018 I have an iframe that is used to display an image, I want the image to automatically fit with iframe's width, like this: ![]() Unfortunately, I couldn't find a solution to this issue except doing the opposize (get a responsive iframe that could fit with its content). Hours spent at StackOverFlow tought me that users do believe this cannot be done, but I'm convinced that there must be a simple solution, may it be a server sided script or a way to alter ShrinkToFit function. Any suggestion? Oh, I don't believe it's necessary as it's a simple line, but this is iframe's code: Code <iframe style="width:94%; height:90vh;" src="RANDOMURL"/></iframe>
RE: Change image size inside iframe - Nachfolger - Apr 16, 2018 Any item within an iFrame is considered a CORS item and cannot be modified unless the website included within the iFrame allows CORS via HTACCESS. Why are you not just downloading the image and including it via a img tag? RE: Change image size inside iframe - Ombra - Apr 16, 2018 (Apr 16, 2018 04:21 PM)Nachfolger Wrote: Any item within an iFrame is considered a CORS item and cannot be modified unless the website included within the iFrame allows CORS via HTACCESS. I'm not using a simple img tag because what I'm trying to build is a basic ebook reader, where users can move between pages with buttons and find it hard (for newbies) to leak content. The iframe allows me display a single ebook page inside the given page, but users reading from mobile would find it hard to take a screen/print the page. I have few ideas for pc users too, but first I need to grant a good visual experience when interacting with the reader. RE: Change image size inside iframe - Nachfolger - Apr 17, 2018 (Apr 16, 2018 10:42 PM)Ombra Wrote: I'm not using a simple img tag because what I'm trying to build is a basic ebook reader, where users can move between pages with buttons and find it hard (for newbies) to leak content.If it's on your own domain, then you should be able to edit it using CSS/javascript. Otherwise, perhaps another approach to your idea would be better. RE: Change image size inside iframe - Ombra - Apr 17, 2018 (Apr 17, 2018 04:46 AM)Nachfolger Wrote: If it's on your own domain, then you should be able to edit it using CSS/javascript. Otherwise, perhaps another approach to your idea would be better. Of course it is on my own domain, but I'm not familiar with JS, can you tell me what I should look for? RE: Change image size inside iframe - Nachfolger - Apr 17, 2018 (Apr 17, 2018 06:02 AM)Ombra Wrote: Of course it is on my own domain, but I'm not familiar with JS, can you tell me what I should look for?If you don't know basic vanilla javascript then you obviously don't have jQuery, but I don't have time to write out the entire plug and play solution. You'll have to do your part in figuring out how to make this work. I've added comments, you just need to include the jQuery CDN above this script. Although, you can find someone to make this vanilla JS, or just google and find a vanilla solution. Code // Replace # with the id of the iFrameI'm assuming setting the width of the image to the width of the user's screen, it should work. I depise iFrames and would never use one in my own website so this is just based off of a theory. Side note: I'm not sure why you appear to take offense to the mention of whether or not it was your own domain. It's completely common to host images etc offsite. RE: Change image size inside iframe - Ombra - Apr 17, 2018 (Apr 17, 2018 08:22 AM)Nachfolger Wrote: If you don't know basic vanilla javascript then you obviously don't have jQuery, but I don't have time to write out the entire plug and play solution. You'll have to do your part in figuring out how to make this work. I didn't take any offense tbh, was just replying to the question :) Also, I didn't expect to get a sample code so I thank you very much for the attention you're giving to my issue. I'll try it out |