Het Iframe gedeelte werkt. Aangezien het idee is dat mensen een categorie kunnen aanklikken, vervolgens een winkelnaam invullen en daarvan de site verschijnt in het iframe-gedeelte, hier mijn volgende vraag:
Is het mogelijk om waar standaard een plaatje met een bootstrap-button dropdown staat, die te laten verdwijnen als er een winkelnaam word aangeklikt, en op de plek van het plaatje en de bootstrap dropdown, de winkelsite te laten verschijnen?
Als ik het goed begrijp moet je via jQuery er voor zorgen dat als je op een link klikt de source daarvan in de source van het iframe komt (oftewel je vervangt de img door een iframe en de keren daarop vervang je alleen de source van de iframe).
Wanneer ik de code zie zou ik misschien een klein stukje voor je uit kunnen schrijven om je de goede kant op te helpen :) Vanavond ben ik niet online dus wellicht geef ik je morgen antwoord (of een ander lid moet mij voor zijn).
Ik ga er van uit dat je weet waar je dit blok code moet plaatsen en dat je de jQuery library gebruikt omdat ik aan je beginpost kan afleiden dat je met bootstrap werkt.
Je zou in principe dus 1 iframe op je pagina hebben met de id='iframe' (in mijn voorbeeld), en meerdere anchor linkjes met een href="source.com" en een class='anchor-iframe' in mijn voorbeeld.
Indien je nog meer vragen hebt of als je vind dat mijn antwoord onduidelijk is hoor ik het graag van je. :)
Veel succes!
edit:
Ik heb het even voor je uitgetypt aangezien ik zulke dingen altijd wel interessant vind.
Je totale plaatje zou er dan zo uit moeten komen te zien:
<head>
<style type="text/css">
html, body, div, iframe {margin: 0px; padding: 0px; border: none;}
iframe {display: block; border: none; height:750px; width:920px;}
</style>
</head>
<!-- Verzameling linkjes -->
<a class="anchor-iframe" title="phphulp" href="http://www.phphulp.nl/">phphulp</a><br />
<a class="anchor-iframe" title="Wat is mijn ip?" href="http://www.watismijnip.nl/">Wat is mijn ip?</a><br />
<a class="anchor-iframe" title="What is my ip?" href="http://www.whatismyip.com/">What is my ip?</a>
<!-- Iframe inclusief title -->
<div id="elementID">http://www.phphulp.nl/</div>
<iframe id="iframe" src="http://www.phphulp.nl/"></iframe>
<!-- Include jQuery via hun CDN -->
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<!-- Voer script uit om iframe source te veranderen. -->
<!-- Hier hoef je in principe niks meer te veranderen, behalve misschien de selector ID's en classes zoals op jouw website. -->
<script>
$( document ).ready(function() {
$('a.anchor-iframe').on('click', function(e) {
e.preventDefault();
var source = $(this).attr('href');
console.log(source);
$('#iframe').attr('src', source);
$('#elementID').html(source);
})
})
</script>
wat nu zo is, is al ga ik naar een topic op PHPhulp in die Iframe, daarboven blijft de tekst gewoon Phphulp.nl/, en dat zou up-to-date steeds moeten veranderen op het moment dat ik in de iframe naar een andere pagina ga.
Ik weet zo snel uit mijn hoofd niet of hier een callback functie voor is, ik zie dat de source van de iframe niet wordt aangepast. Ik snap wat je bedoeld alleen zou zo snel niet weten hoe je zoiets kunt realiseren.
