|
HTML - Can't Link To Section Of Other Page Due To Permalink Structure
Hi all,
Im trying to link to a section of one page from a different page. Normally it's quite simple but i am using a different linking setup and it's confusing me, i'm afraid. Basically my page setup is I have separate folders for each page, than inside those folders is an index.html page. the page url does not show the .html it only shows the folder name. This is done via my htaccess file (can't remember where i found this solution from). Any way this setup causes problems linking to sections of other pages, has anyone encountered this before, am i missing something simple? Any help is appreciated! Similar TutorialsOkay, so obviously, this is my first post, and i know how much forum-ers can hate on first posters, but I have a valid question here First of all, I really dont even know what coding language I should use to do this. I am fairly experienced in PHP, CSS, and HTML. JS is new to me, but I am learning. Anyways, what I want to do, is have someone click on a link that links to a section of the same page (such as "<a href="#section">) and the part of the page containing the <a name="section"> code is hidden. When the <a href="#section"> link is clicked, a section of the page disappears and the section containing the <a name="section"> appears. My first instinct is that JavaScript would be the easiest to do this, but I'm not super experienced in it, so I'm kinda lost. I really don't know how to explain this any more thoroughly, but I will answer any questions to the best of my ability. Thanks in advance, Austin Hi I have this problem that my comment script is located at public_html/comments but the page that needs it is at public_html/hamburgerbar/fish/dish so in the code when i have the php include pointing at /comments, its not working how do i make the browser understand where the comments its? cause i tried with http://www.mysite.com/comments and it says permission denied. However when i move the target page in the comment folder it works like a dream. So how do i point my include link there? Thanks for help! Hello. I am trying to code a "simple" webpage. It will have two drop downs. Each drop down will have a few selections. You, the user, choose two selections from each drop down. The you press submit/go button. if you house apples for dropdown 1 and green for dropdown 2, it would then insert these keywords into a link such as www.test.com/apples11green.html or www.test.com/apples/green.html, etc etc... basically i want to specify to variable spots in a link, and have the drop down selections place into those links. Greetings, So I have my page done. It works too (imagine that). I structured my page like a laymen tho. With my page, I have only one element changing and all the media gets placed in this "window" (see attached image). So here is what I did: if you click on the icon for A.mov you go to A.html. A.html is an identical page the previous EXCEPT it holds A.mov... and so on. The problem is that this of course reloads everything in the window. It isn't the worst thing but seeing how much time I put into this website it would be nice to get it perfect. I know a possible solution is to put in an inline frame, i don't really want to do this... I was wondering if there was anything fancy you boys know about to fix this problem... besides the inline frame? Hi all, Up until recently, my HTML and CSS skills have been (at best) messy and probably not the correct way of doing things. I am attempting to re write a site I wrote about a year a go, using HTML5 and CSS3. At the moment, I have a basic layout which looks like this: (Screenshot cut off a little bit of the right side of the site) http://i146.photobucket.com/albums/r...30790/site.jpg Anyway, what I wanted to do was, within the element containing "Main Content", have two divs side by side. I want to have a photo on the right side and text on the left side. However, I am unsure as to how to do this. I have given it a go and searched the web but cannot find a solution. I want to avoid using a table for this. I have a couple of things I need to ask but these can wait until another time! Code: <!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="nav.css">
<meta charset="utf-8">
<meta name="keywords" content="Wells","Somerset","Weddings","Wedding Planning,Wells, Somerset,Parties,Events,Events Management, Weddings in Somerset, Catering, Catering in Somerset."/>
<title>Gert Lush Events - Weddings, Catering, Parties, Functions - Based in Somerset</title>
</head>
<body>
<header>HEADER (Banner)</header> <!-- Done -->
<nav>
<table id="links" width="100%" height="100%">
<tr>
<td>
<a href="index.html">Home</a>
<a href="services.html">Services</a>
<a href="food.html">Menus</a>
<a href="gallery.html">Gallery</a>
<a href="reviews.html">Testimonials</a>
<a href="contact.html">Contact</a>
</td>
</tr>
</table>
</nav>
<div>
<div class="left">MAIN CONTENT</div>
<div class="right">MAIN CONTENT</div>
</div>
<aside class="left"></aside> <!-- Done -->
<aside class="right"></aside> <!-- Done -->
</body>
</html>
Code: header{
width:80%;
height:20%;
background:#FFDC97;
color:white;
text-align:center;
position:fixed;
top:0%;
left:10%;
}
nav{
font-size:62.5%;
display:block;
width:80%;
height:5%;
background-image: -o-linear-gradient(bottom, #3C2414 40%, #A68153 90%);
position:fixed;
top:20%;
left:10%;
}
div{
display:block;
width:80%;
height:100%;
background-image: -o-linear-gradient(top, #FFDC97 0%, #FFFAE8 100%);
color:black;
text-align:center;
position:fixed;
top:25%;
left:10%;
}
aside.left{
height:100%;
width:10%;
background-image: -o-linear-gradient(right, #494949 0%, #767676 100%);
position:fixed;
top:0px;
right:0px;
}
aside.right{
height:100%;
width:10%;
background-image: -o-linear-gradient(left, #494949 0%, #767676 100%);
position:fixed;
top:0px;
left:0px;
}
Any ideas? Thanks [] here's the initial page: http://www.shscorp.ca/content.aspx?f...incentives.htm If you click on "GLOBE Board of Directors" on the left hand menu, it won't jump to the section #board on the index.htm page. Why is that? I already placed the <a name="board"></a> tag on the other page. Any help is great. I have a long page with opening paragraphs that I wrote, followed by a long list that might be buried somewhere else on the Web (duplicate content). The list looks like spam (it isn't) and I'm concerned that the page will not get indexed. Is there a simple way to mark the sections that should not be crawled? As a last resort, I could put the list on a separate page with "nofollow" links. Here is the page: http://www.iaps.com/list-of-internet...ns-199010.html Can I click on a thumbnail picture and have it open up below some text on the same page but using a larger size pix. TIA Hello everyone, New to this forum, hoping I can get some help. I am somewhat new to HTML, so I'm running into roadblocks every once in a while, most of which I've gotten through myself. I have a problem with an iFrame I want to use. I need to find a way to have an iFrame jump to a section of a page that I want to display. I am building a website for a hockey team. The URL is http://web.mac.com/chris.ducasse/for...a/gameday.html you will see an iFrame that embeds a page from "pointstreak.com" I want the iFrame to automatically jump down to the "scoreboard" section. Is this possible? If not, is there a way to get rid of the scroll bars for ALL browsers? I want to thank everyone in advance for their help, glad to be a part of this forum, looking forward to learning a lot! Im in the process of uploading my site to my server and I set up some folders server side so things would be somewhat organized. My problem is setting up the links in my html docs. I cant go back a folder in the directory structure. Right now I can only get links to work if they go deeper in the folder structure or if Im linking to another html doc thats in the same folder as the one Im currently on. How do I go back a level? For instance my index doc is at the very top level, how can one of my pages deeper in go back to the home page? Thanks. hi everyone this is my first page so i will probably have a couple of questions to help give me an idea of how to do that i want! basically someone has asked me to design them a site, i did a web design course but that was 6 months ago and i need to learn new things for it as well as try and remember what ive learned! ive got a semi basic layout, ill post the html and css, hopefully ill pate them in the right way (this definitely wont be the colour scheme, ive been following an online tutorial, want to get the layout right before making other tweaks) basically in the content section theyre looking for a rectangular box that has 4 imaes, 2 side by side and two below. these will change when theyre rolled over and when a particular image is clicked it will take them to the correct section of the site. as far as i understand from the css i have the size of the content section will change depending on how much information is there. how would i know what size to make the flash for insertion into this section so it fits properly without any gaps? sorry im a bit new to this but the more i learn the better! i dont have a clue how to actually code the flash yet but getting the size right would be a good start! thanks for your help HTML Code: <link rel="stylesheet" type="text/css" href="css/master.css" />
</head>
<body>
<div id="page-container"> <!--this div will hold all the other elements of the page-->
<div id="main-nav">Main Nav</div>
<div id="header">
<h1> Kilmaclolm Dramatic Society logo to be placed here </h1>
</div>
<div id="sidebar-a">
<dl class="hidden">
<dt id="about"><a href="#">About</a></dt>
<dt id="services"><a href="#">Services</a></dt>
<dt id="portfolio"><a href="#">Portfolio</a></dt>
<dt id="contact"><a href="#">Contact Us</a></dt>
</dl>
</div>
<div id="content">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam gravida enim ut risus.
Praesent sapien purus, ultrices a, varius ac, suscipit ut, enim. Maecenas in lectus.
Donec in sapien in nibh rutrum gravida. Sed ut mauris. Fusce malesuada enim vitae lacus
euismod vulputate. Nullam rhoncus mauris ac metus. Maecenas vulputate aliquam odio.
Duis scelerisque justo a pede. Nam augue lorem, semper at, porta eget, placerat eget,
purus. Suspendisse mattis nunc vestibulum ligula. In hac habitasse platea dictumst.
</div>
<div id="footer"><!--floated divs dhould come first to avoid any IE issues-->
<div id="altnav">
<a href="#">About</a> -
<a href="#">Services</a> -
<a href="#">Portfolio</a> -
<a href="#">Contact Us</a> -
<a href="#">Terms of Trade</a>
</div>
Copyright © Kilmacolm Dramatic Society. A website by D Keenan
</div>
</body>
</html>
Code: @charset "utf-8";
/* CSS Document */
html, body { /*resets the margins and padding on both the html and body tags to 0 to ensure theres
no space between the top of the browser and the top of the page */
margin: 0;
padding: 0;
}
h1 {
margin: 0; /* takes away the default margin and padding on h1 tags */
padding: 0;
}
.hidden {
display: none; /* any element with this class wont be seen on the site */
}
#page-container { /* there is a # as this is an id, to be used once on the page only, not repeated elsewhere
this div's height will change depending on the content*/
margin: auto; /* browser sets margin, should centre the div */
width: 760px; /* sets the width of the container */
}
#main-nav {
background: red;
height: 50px; /* the width doesnt need to be specified, it will be 760px as this is the with of the containing div */
}
#header {
background: blue;
height: 150px;
}
#sidebar-a {
float: left; /* floats sidebar to left of the screen */
background: darkgreen; /*the height is dependend on the content so no height will be set for the time being*/
width: 280px;
}
#content {
background: green; /*the height is dependend on the content so no height will be set for the time being*/
margin-left: 280px; /*creates a margin as wide as the sidebar to separate the sidebar information and the content */
}
#footer {
clear:both; /*When an element has the clear property assigned, if it comes into contact with a float it is placed right below where that float ends.*/
background: orange;
height: 66px;
}
Hello! I've recently been setting up a tumblr for my online portfolio, and have encountered an issue that I haven't managed to resolve. I have two categories - design and photography. To add pieces of work to my portfolio, I upload an image to sum up that project. If it's just a photograph, it's fine that when it is clicked it just goes to that post through {Permalink}. But if someone clicks an image for design work, I want it to take them to a separate page with a bit more information. I've managed to get this to work with {LinkURL}. My problem is that I can only get them to work one at a time. I can either have the images redirecting to a specified page, or going to the actual post - not both, depending on the content type. Here's some code that will hopefully help you see my problem: Code: {block:Photo}
<div class="post photo">
{block:IndexPage}<div class="box">
<img src="{PhotoURL-400}" alt="{PhotoAlt}"/>
<a href="{Permalink}" class="box-caption">
<p>{PhotoAlt} </p></a>
</div>
{/block:IndexPage}
{block:PermalinkPage}
<div class="middle">
<div class="middle-content">
<a href="{PhotoURL-HighRes}">
<img src="{PhotoURL-500}" alt="{PhotoAlt}" border="0"/>
</a>
</div>
</div>
<div class="caption">
{block:Caption}
{Caption}
{/block:Caption}
{block:HasTags}
<div class="tags">Tags:
{block:Tags}<a href="{TagURL}">{Tag}</a>
{/block:Tags}
</div>
{/block:HasTags}
{block:PermalinkPagination}
<div class="permpaginate">
{block:NextPost}
<a href="{NextPost}">Previous Project</a>
{/block:NextPost}
{block:PreviousPost}
<a href="{PreviousPost}">Next Project</a>
{/block:PreviousPost}
</div>
{/block:PermalinkPagination}
</div>
{/block:PermalinkPage}
</div>
{/block:Photo}
I have enabled "click-through" on my design posts but this doesn't work with the above code. I have to change <a href="{Permalink}" class="box-caption"> to <a href="{LinkURL}" class="box-caption"> which obviously means that now the Permalink doesn't work. Hopefully that's a clear enough explanation! I'd be very grateful if anyone can help me resolve this Thanks! There are 5 copies of the same images are placed in a folder i.e. large(1024*768),medium(500*375),small(240*180),thu mnail(75*75),square(100*50) in size.... The following code upload number of Geocoded images(square size) when the page loads.I want when someone click on the any Geocoded image on the page ,it should show the large image(1024*768) of the same.And further click on the large image it must show again the square size image of the same. Following is the actual code.It is in .js file . var epsg4326 = new OpenLayers.Projection("EPSG:4326"); var OSVMain = (function() { var map, markers, map_move_timeout; var photos = {}; function mapChange() { if( map_move_timeout ) clearTimeout(map_move_timeout); map_move_timeout = setTimeout(mapChangeTimeout, 500); updateLinks(); } function updateLinks() { var center = OSV.getMapCenter(map); var zoom = map.getZoom(); $('#permalink').attr('href',OSV.getURLBase()+'?lat ='+center.lat+'&lon='+center.lon+'&zoom='+zoom); $('#kmllink').attr('href',getLocateLink('kml')); } function getLocateLink(format) { var extent = OSV.getMapExtent(map); var url = OSV.getURLBase()+'/api/photos/locate.'+format+'?bbox='; url += [ extent.left, extent.bottom, extent.right, extent.top].join(','); return url; } function mapChangeTimeout() { map_move_timeout = null; var url = getLocateLink('json'); $.get( url, null, photosLoaded, 'json' ); } function photosLoaded(json) { var new_photos = {}; var size = new OpenLayers.Size(50, 50); var offset = new OpenLayers.Pixel(-25, -25); for( var i = 0, l = json.length; i < l; ++i ) { var p = new OSVPhoto(json[i]); if( photos[p.data.id] ) { new_photos[p.data.id] = photos[p.data.id]; photos[p.data.id] = null; } else { var position = new OpenLayers.LonLat(p.data.lon,p.data.lat); var icon = new OpenLayers.Icon(p.url('square'), size, offset); p.marker = new OpenLayers.Marker(position.clone().transform(epsg4 326, map.getProjectionObject()), icon); new_photos[p.data.id] = p; markers.addMarker(p.marker); } } for( var k in photos ) { var p = photos[k]; if( p && p.marker ) markers.removeMarker(p.marker); } photos = new_photos; } function setup() { var vectors; var popup; map = new OpenLayers.Map($('#map').get(0), { controls: [ new OpenLayers.Control.ArgParser(), new OpenLayers.Control.Attribution(), new OpenLayers.Control.LayerSwitcher(), new OpenLayers.Control.Navigation(), new OpenLayers.Control.PanZoomBar() ], units: "m", maxResolution: 156543.0339, numZoomLevels: 20, displayProjection: new OpenLayers.Projection("EPSG:4326") }); var mapnik = new OpenLayers.Layer.OSM.Mapnik("Mapnik", { displayOutsideMaxExtent: true, wrapDateLine: true }); map.addLayer(mapnik); var osmarender = new OpenLayers.Layer.OSM.Osmarender("Osmarender", { displayOutsideMaxExtent: true, wrapDateLine: true }); map.addLayer(osmarender); var numZoomLevels = Math.max(mapnik.numZoomLevels, osmarender.numZoomLevels); var start = OSV.getStartLocation(); var numzoom = map.getNumZoomLevels(); if (start.zoom >= numzoom) start.zoom = numzoom - 1; map.setCenter(start.pos.clone().transform(epsg4326 , map.getProjectionObject()), start.zoom); OSV.setupMapEventHandlers(map); map.events.register("moveend", map, mapChange); map.events.register("zoomend", map, mapChange); mapChange(); markers = new OpenLayers.Layer.Markers("Markers", { displayInLayerSwitcher: false, numZoomLevels: numZoomLevels, maxExtent: new OpenLayers.Bounds(-20037508,-20037508,20037508,20037508), maxResolution: 156543, units: "m", projection: "EPSG:900913" }); map.addLayer(markers); } return { setup: setup, 1:1 }; })(); $(function(){ OSVMain.setup(); }); Any suggestions ? Thanking you Hi peeps, I apologise if this is in the wrong section, if so, please move to appropriate category. I have a basic understanding of HTML coding and I am attempting to learn new skills and tricks to help me in my development. I am currently in the process of developing a new site for myself and on this site I will have a news page, which I update weekly with news from the industry. I was wondering what is the best way of going about new news articles (written by myself, not taken from external sources) and also how to automatically update the 'news' snippet on the homepage when I add a new news article? Any advice or pointers in the right direction would be greatly appreciated. Thanks How to link one page to another page in HTML? ------------------------------------------------------ Hello, Can someone tell the code to make something like this page. It has the boxes right in the middle with the link code inside the box. http://www.myspacearcade.com/page/2.html I just want to make the box with the link inside the box. I have been trying everything possible, going from pillar to post on the internet, trying to work out how to link to another page in my folder. I basically have a folder called "webpage". In that folder is index.html & products.html. in the index.html codes, i have put tabs so i can link to other pages. 1 tab is called products. I have entered in: <div class="mybutton"> <a href="products.html"> <center> <button style="width:160;height:24; background-color:#97cfc3">Products </button></a><br> </center> </div> but it just says... "THIS WEB PAGE CANNOT BE FOUND". any help would be drastically appreciated!!! is there any way i can link to the current displayed page. for example: Code: <a href="/">root</a> would link to the root domain. is there something similar i can use? thanks I just launched this new site, www.dvbenefits.net , and I need link to an external form with Aetna. Here is the issue... I'd like for people to land on: (PAGE B) https://ips.aetna.com/Retail/Quote/QuoteInfo.aspx HOWEVER it needs to come from the below page to be "tagged" to my comissions. (you can see my name in the lower right side) (PAGE A) https://ips.aetna.com/Retail/Home_Lo...d=kvW7H2/Zx1M= I am loosing clicks do to this extra step. Is there a script that I can put on my site that can tell (PAGE B) that the visitor is comming from my ID (PAGE A) without having to land on (PAGE A)? Can anyone advise on how I can do this? Thanks! I tried using the search function, but I don't know if it's my browser or what but it won't finish loading the results page. Is there a way in HTML, to create a link that can go to two possible pages, but when you click it, it randomly goes to either one? Thanks, Jon |
|||||||