I have tried with Iframe but I can only display the whole web page.
I would like to display only a part of the page, a subdivision or even just a value of the page.
Thanks for your help ;)
I don't think iframe is a suitable tool to do that. But you can tweak the max-width, margin, height, width of the iframe to somehow display the targeted part.
Detailed info: https://www.dimpost.com/2012/12/iframe-how-to-display-specific-part-of.html
Alternatively, you can use jquery for the same.
Here is an explanation:
iframe to Only Show a Certain Part of the Page
Related
Background:
I have a couple of different websites on different domains. All of these websites have a part which is identical. Therefore I've made this part into its own page, and want to incorporate it into the websites with an iframe. That way, only one page needs to be updated to change the identical part on all the websites.
Problem:
At this time, I'm using the plugin Advanced iFrame to add the iframe to the website:
[advanced_iframe src="addressToPage" width="100%"]
but I can't get its height to be the same as the height of the page it's displaying. Is there a way to do this with Advanced iFrame or is there another wordpress plugin that allows me to do this? Note that I want the iframe to be the height of the page it's containing, not the height page the iframe is being diplayed on.
Thanks in advance.
I seek to embed a Desmos page onto my website, having all other display elements removed but the graph itself and 'sliders'. In the linked example, I'd like to keep only the a = ... slider, and move it to the bottom of the page; should look like
How can this be accomplished? Help is appreciated.
The iframe will show the entire site, so that might not be the right solution for you. You could try masking the rest of the content by putting the iframe inside of another element, but that might not be what you are looking for either. The website does offer and export to image feature. Could that work for your needs?
I've got a tough one. I work for a company that uses a sharepoint that is 100% text based due to varying network performace issues accross the world. It provides the option to input HTML for styling but scrubs any javascript. I do not have access to code CSS and I'm assuming jquery is not available.
I would like to embed images into the sharepoint as a proof of concept by taking advantage of a floating div (or iframe) that displays with an href to display a png file stored on a server. I don't want the div (or the image) to load unless the user clicks a link or a button.
I'm pretty amature at anything other than basic HTML formating. I'm not even sure it's possible to do something like this with only html.
Thank you in advance to anyone willing to take a stab at this.
You could do it with this HTML, which is ugly and unmaintainable.
Use an iframe with scrolling="none". Use width and height attributes to give it dimensions.
Inside the iframe have your img elements with an id attribute. Ensure they're spaced with enough vertical space so they can't be seen by default, and appear isolated when viewed later.
Link your links to those id attributes, e.g. link
This is probably a really simple question. I have a link on the page tsawebmaster1.hhstsa.com/web_design.html that links to a div on the same page as the link itself using tsawebmaster1.hhstsa.com/web_design.html#seven_steps and it works just fine. The problem is that my fixed header is at the top of the page and thus overlaps the content by 100px, so when it takes you to that div, the user does not see the top of the div linked to. Is there a way I can link 100px less than a certain div.
I don't know if this will work but you should try this:
Our seven core steps to web design will teach you the simple steps on how a website is built. Before delving into any new topic, it is important to develop background knowledge of the whole picture. This way, when you start actually learning web design in depth, you'll be able to connect your under
Try put an empty paragraph between your logo and the contents.
You better use javascript to reach your goal. the window.scrollTo(x,y) function can make your page scroll to a specified amount of pixels on click (also it will look much more neat).
documentation: https://developer.mozilla.org/en-US/docs/Web/API/window.scrollTo
usage:
click to scroll down 100 pixels
Is it possible to use CSS to work like frames?
What I mean is, when we use frames (left, right for example), clicking on left will refresh only the right section using the 'target' attribute.
Is it possible to create this effect with CSS?
Thanks.
Using frames is usually a bad idea
To answer your question, no, CSS cannot be used to work like frames. CSS is used to changing the style of HTML and as such, cannot actually change the content of a page. It can be used to hide content, but I don't think that is what you require.
However, I feel in this case you may be asking the wrong question. As frames are usually the wrong approach.
When starting out in web design, frames seem like a great idea. You can seperate your navigation from your content, your site will load quicker because the navigation is not loaded every time and the menu is always visible, even when the page is loading.
But, actually, frames are incredibly bad for your usability.
Your users cannot bookmark individual pages
Printing is broken
Standard features in a browser like open in new tab often breaks
Users cannot copy/paste the web address for a specific page for sending to a friend
Frames do have their uses (e.g. Google image search), but for standard navigation menus they are not recommended. Try creating a page in a dynamic server language such as PHP or ASP.NET.
These languages have ways of creating standard elements such as your navigation menu without the use of frames.
No, this has nothing to do with CSS. CSS is for styling elements only. What you are looking for is an IFRAME. And IFRAME can be given a name
<iframe name="my_iframe" src="xyz.htm"></ifram>
and then be targeted in a link.
I've got a design that relies on framed content using CSS. You can do this by using overflow:auto, however it won't do what you want, i.e. loading certain portions of a page. To do this you'd need to use some AJAX library such as jQuery to load the content area dynamically. This is quite dangerous though as your URL may not relate to the current content of the page.
You could probably do something with the overflow part of CSS.
If you set up a div with overflow:auto with a fixed width and height with alot of content you will get scrollbars. Potentially you could use anchors to get content to move to be viewed within the div.
This means that all your content is in one page and it is just moved around with the anchors. You could do a similar thing using a jquery tabs plugin too.
I have never tried this and it might need javascript to get it to work fully.