Open a new site, scrollbar at the bottom - javascript

I will at my forum-system when I'm opening a new site that the scrollbar is at the bottom of the site, so that I don't have to scroll down. I have no ideas how to make a code for this, because I'm not the pro in JavaScript..

One way is to place a bookmark at the bottom of the page. Example:
<a id="bottom"></a>
When you open the page, include the bookmark as hash. Example:
show

You can use css to complete the task:
Use this code in css
<style type="text/css"> body{overflow-x:hidden;} *{ overflow-x:hidden;} html, div, span, p, label, textarea{ overflow-x:hidden; } </style>
You don't need to use JavaScript to hide bottom scrollbar in the html page

Related

Force a java script to fit within an element

I'm not a programmer, but I need to find out if there's a way to force a java script to fit completely within an element in my page, without showing a horizontal scroll bar. Sorry if I use the wrong terminology.
Below is a given code that I get from a third party, which I place on my page, to get a display gallery of items. The problem is that it too wide.
Is there a code I can add, to force the script to completely fit inside the screen (600px wide), so the horizontal scroll bar disappears automatically?
Below is the script:
'<noscript>
<p>powered by example.com</p>
</noscript>
<script id="scriptId_718x940_60872" type="text/javascript" src="//example.com/?scriptId=60872&bid=1301660001&format=718x940&bannerType=3">
</script>
I should add that this is a specific html element within my page, and that I'm trying to apply this code only to this element, not to the whole page or the whole site.
Thank you so much for your help!
600 what? I'm going to assume pixels. Add this to your CSS:
body {
max-width: 600px !important;
}
Added !important in edit
Add this to your html. It isn't very pretty but it should narrow the iframe that is displaying the coupons.
<style type="text/css">
div#ci_gallery {
width: 600px;
overflow: scroll;
}
</style>

How to hide a external script when browser window resizes

So I have an external script(a chatterbox one) hosted on another website. It's positioned to the right of my list with float:right. The problem I have is that when the browser window resizes, it overflows onto the list. I have tried overflow:hidden; but that doesn't work.This is what happens when the browser window overflows.
This is how it normally looks.
Try using a CSS media query, like this:
#media (max-width:600px) {
#chat-box {
display: none;
}
}
This can be read as:
If the screen is less than 600px wide, hide the element with the id chat-box.
Place this in a style tag or in a .css file.
Ref: https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries
Try using a CSS important, like this:
overflow: hidden !important;

How can I print just an area inside a DIV

I have a page with a top navigation area, a side navigation area, a control button area and somewhere in the middle a DIV with an id="content" that contains content.
I would like to be able to print just the contents of that DIV. I realize I have many lines of code making my other areas invisible and resizing everything but is there some alternative? Is there some way I can just print the contents of the DIV?
Take a look at using Media Types - specifically #media print - in your CSS to specify styling that only applies to printing.
This way, you can write a stylesheet that hides everything except your "area inside a DIV".
Use a css print stylesheet putting display:none in the fields that you don't want to print.
Use the tag link like this:
link rel="stylesheet" type="text/css" media="print" href="print.css"
OR
#media print {
BODY { font-size: 10pt }
}

Get rid of useless scroll bars on fancybox iframe

I have some content I want to show in iframe with fancybox. When I use it, it pops up with horizontal and vertical scroll bars even though all the content is inside of it. Inspecting it in Firefox shows that when I click on html everything is inside but there is a little left over that is outside of the highlighted box. The next level up is iframe.fancybox-iframe which includes the scroll bars. I looked at the css and that has padding and margins set to zero so I don't know why the scroll bars are there. Right now as far as options I just have autoSize:false. All I have inside the body of the page I want to show is a form.
If anyone wonders which class name to use
.fancybox-inner {
overflow: hidden !important;
}
And if you found a small white background you can reset it using
.fancybox-skin {
background: inherit;
}
Try adding this to the css:
.style{
overflow: hidden;
}
If it didn't help, please post your HTML and CSS.

Making html menubar

Hey I am trying to make a topbar for my site as a navigation bar. This is what I get currently, how can I make it so that it's connected to the sides and to top. I don't want that space between the page and the bar. Sorry I am very beginner in this. See this picture to see what my page looks like now http://i55.tinypic.com/dgnpro.png
My CSS code for bar
#topbar
{
background-image:url(../images/topbar.png);
background-repeat:repeat-x;
width:100%;
height:50px;
}
add on your css html, body {margin:0; padding:0;} This will make your bar to start of your page from the start without any space.

Categories

Resources