Hallo!
Sinds twee dagen ben ik bezig met het maken van een
simpele joomla (3.6.2) website.
Ik gebruik een 'Category Blog' pagina om de artikelen
weer te geven.
Ik wil graag, dat de artikelen uit en in kunnen klappen
met een knopje, zonder dat je daarbij de 'Category Blog'
pagina verlaat.
Gisteren heb ik ergens een accordion extensie gezien,
die ook een 'collapse div' knop toevoegt aan de tinymce
editor. Ik ben alleen de naam van deze extensie kwijt,
als iemand die kent, hoor ik het graag!
Ik heb zelf wat geprobeerd met JQuery, wat, als je het
direct in de browser laadt, wel werkt.
Als ik het script in de protostar template, in de head
sectie plaats en de div en button in de artikelen zet,
wordt de tekst in de button wel aangepast(... -> Read more...),
maar in en uitklappen van de div werkt niet. (Category Blog)
De <a href....</a> wordt door TinyMCE (of een post-processor)
tussen <p> </p> geplaatst.
Hier is de code:
Heeft iemand tips?
Ik wil best wel betalen voor een extensie, als het maar
een beetje binnen de perken blijft :) (50 euro is wel de max)
Alvast bedankt!!!
Groet,
Derk
Sinds twee dagen ben ik bezig met het maken van een
simpele joomla (3.6.2) website.
Ik gebruik een 'Category Blog' pagina om de artikelen
weer te geven.
Ik wil graag, dat de artikelen uit en in kunnen klappen
met een knopje, zonder dat je daarbij de 'Category Blog'
pagina verlaat.
Gisteren heb ik ergens een accordion extensie gezien,
die ook een 'collapse div' knop toevoegt aan de tinymce
editor. Ik ben alleen de naam van deze extensie kwijt,
als iemand die kent, hoor ik het graag!
Ik heb zelf wat geprobeerd met JQuery, wat, als je het
direct in de browser laadt, wel werkt.
Als ik het script in de protostar template, in de head
sectie plaats en de div en button in de artikelen zet,
wordt de tekst in de button wel aangepast(... -> Read more...),
maar in en uitklappen van de div werkt niet. (Category Blog)
De <a href....</a> wordt door TinyMCE (of een post-processor)
tussen <p> </p> geplaatst.
Hier is de code:
HTML Code:
<!doctype html>
<html lang="en">
<head>
<script src="http://ift.tt/2cndYc6;></script>
<script src="http://ift.tt/2dmv1yY;></script>
<script>
$(function() {
$('.article2').hide();
var showbut = ('<button>Read more...</button>');
var hidebut = ('<button>Read less...</button>');
$('.toggle2').html(showbut);
$('.toggle2').click(function() {
$nextArticle = $(this).prev('.article2');
if ($nextArticle.length) {
$nextArticle.is(':visible') ? $(this).html(showbut) : $(this).html(hidebut);
$nextArticle.is(':visible') ? $nextArticle.slideUp() : $nextArticle.slideDown();
}
return false;
});
});
</script>
</head>
<body>
Introtext1<br>
<div class="article2">
Article1 Content
</div>
<a href="#" class="toggle2"><button>...</button></a><br />
Introtext2
<div class="article2">
Article2 Content
</div>
<a href="#" class="toggle2"><button>...</button></a><br />
</body>
</html>
Heeft iemand tips?
Ik wil best wel betalen voor een extensie, als het maar
een beetje binnen de perken blijft :) (50 euro is wel de max)
Alvast bedankt!!!
Groet,
Derk
Vraag Op zoek naar article accordion in category blog weergave
شارك عبر الماسنجر
