Page 1 of 1 [ 4 posts ] 

Aut2Know
Hummingbird
Hummingbird

Joined: 10 Dec 2015
Posts: 21

28 Jan 2016, 8:25 am

I'm working on my first website from scratch, using html and css as of yet. I want to stick to css as much as possible. I'm currently working on the about page, and I want to have previews of articles they can click on and then have the full article they click on pop up in a designated area on the screen. I'm very new at this... I know with the top menu, each menu button is made a link that leads to a different page, would it be overkill to have each article be a link that opens up a different html version of that page, but with that article displayed. some pseudocode the best I can do..

Code:
 
<div class="articlechoose">
    <a href="samepagediffarticle1.html">article 1</a>
    <a href="samepagediffarticle2.html">article 2</a>
    <a href="samepagediffarticle3.html">article 3</a>
    <a href="samepagediffarticle4.html">article 4</a>
</div>
<div class="articledisplay">
    <article>
         ......This is where I will put the specific article, the only part of each html thats different
    </article>
</div>


I hope this makes sense. I know I could do it in javascript, and I plan on making a more responsive version, but I understand it's best to make it as backwards compatible as possible? Is this something people do for the effect I'm looking for? Is it just another unnecessary page load?



azzazinator
Raven
Raven

User avatar

Joined: 31 May 2012
Age: 48
Gender: Male
Posts: 110
Location: Denmark

01 Mar 2016, 1:08 am

It's a little late, I know
I'm not sure what the question is, but If you still need help, please ask...


_________________
Your Aspie score: 168 of 200
Your neurotypical (non-autistic) score: 30 of 200
You are very likely an Aspie
Diagnosed
AQ=44, IQ=136


Ethan2004Minecraft
Emu Egg
Emu Egg

Joined: 2 Mar 2016
Age: 20
Gender: Male
Posts: 3
Location: Isle of wight

02 Mar 2016, 1:48 pm

:idea: have you tried using sprites to link in between backgrounds and pages for your website :?: :?: :?:



Rusht
Emu Egg
Emu Egg

Joined: 17 Apr 2016
Age: 38
Gender: Male
Posts: 1

17 Apr 2016, 2:38 am

The best way to do this would be in javascript.

In your javascript file

var $iframe = $("#theFrame");

$('#articlechoose a').click(function(event){
event.preventDefault();
var location = $(this).attr("href");
$iframe.attr('src', location);
});


in your html file where you have <article></article> put <iframe id="theFrame"></iframe>

Now I'm not a very big fan of iFrames, but this would be the fastest way to do it. You can style the frame to fit what you need.