[PHP] Klap-uit tekst - Softwareontwikkeling

maandag 7 september 2009 21:17

Acties:

0 Henk 'm!

Topicstarter

Hallo allemaal, ik ben hier al een tijdje naar op zoek maar ik kan het nergens op internet vinden

, bij elke google search krijg ik niet het resultaat wat ik zoek.
Ik zoek een php-scriptje of html waamee ik een soort tekst kan maken zoals "click here to read more..." en dat er dan tekst wordt uitgeklapt, het liefst zonder CSS.

Als iemand mij hierbij kan helpen, zou dat erg fijn zijn

gr. devos50

maandag 7 september 2009 21:18

Acties:

0 Henk 'm!

posttoast

Waarom zonder CSS?

Een manier waarop je dit kunt doen is:

* Maak een element met daarin de tekst die normaal verborgen is (display: none)
* Zorg er met javascript voor dat je, wanneer je op de link "click here to read more" klikt, de display: none van dat element afhaalt
* Klaar!

Heeft helemaal niets met PHP te maken.

omniscale.nl

maandag 7 september 2009 21:21

Acties:

0 Henk 'm!

NMe

Quia Ego Sic Dico.

Zolang je denkt dat dit ook maar een heel klein beetje met PHP te maken heeft, denk ik niet dat je ook maar iets gaat vinden op het internet. Je doet dit door met Javascript de style property aan te passen. Daarmee zet je display: none op het gewenste element voordat je klikt, en display: block nadat je hebt geklikt. En daar zijn als het goed is meer dan genoeg voorbeelden van te vinden.

'E's fighting in there!' he stuttered, grabbing the captain's arm.
'All by himself?' said the captain.
'No, with everyone!' shouted Nobby, hopping from one foot to the other.

maandag 7 september 2009 21:24

Acties:

0 Henk 'm!

Verwijderd

Zoiets?

Klik

maandag 7 september 2009 21:26

Acties:

0 Henk 'm!

devos50

Topicstarter

Bedankt allemaal =)

Ik wou graag het liefst zonder CSS omdat ik nu bezig ben met PHP/SQL en me niet zo wil verdiepen in het CSS-gedeelte, ziet er ook redelijk moeilijk uit

.
Ik zal het toch proberen om met een css bestandje te maken, bedankt voor de reacties!

maandag 7 september 2009 21:27

Acties:

0 Henk 'm!

posttoast

Verwijderd schreef op maandag 07 september 2009 @ 21:24:
Zoiets?

[html]<a onClick="document.getElementById('woei').style.display = 'block'" style="text-decoration: underline">Klik</a>
<div id="woei" style="display:none">Lalalalaalalalaalaaaaalaalalaalaaaaaaaalalalalaalalalalalatekst</div>[/html]

Mwah, geef in ieder geval de "klik" nog even een ander kleurtje als ie is uitgeklapt. En zorg dat ie ook weer in kan klappen.

devos50 schreef op maandag 07 september 2009 @ 21:26:
Bedankt allemaal =)

Ik wou graag het liefst zonder CSS omdat ik nu bezig ben met PHP/SQL en me niet zo wil verdiepen in het CSS-gedeelte, ziet er ook redelijk moeilijk uit .
Ik zal het toch proberen om met een css bestandje te maken, bedankt voor de reacties!

Hoe wil je überhaupt een site bouwen zonder CSS?

[ Voor 30% gewijzigd door posttoast op 07-09-2009 21:28 ]

omniscale.nl

maandag 7 september 2009 21:52

Acties:

0 Henk 'm!

XWB

Devver

devos50 schreef op maandag 07 september 2009 @ 21:26:
Bedankt allemaal =)

Ik wou graag het liefst zonder CSS omdat ik nu bezig ben met PHP/SQL en me niet zo wil verdiepen in het CSS-gedeelte, ziet er ook redelijk moeilijk uit .
Ik zal het toch proberen om met een css bestandje te maken, bedankt voor de reacties!

Niks is moeilijk. Hierbij een voorbeeldje (sla op in een test.html oid en probeer wat uit).

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <script type="text/javascript">
            function showText () {
                document.getElementById ( 'hiddentext' ).style.display = 'block';
            }
        </script>
        <style type="text/css">
            .hiddentext {
                display: none;
            }
        </style>
    </head>
    <body>
        <p>The quick brown fox jumps over the lazy dog. <a href="index.php?action=readmore" onclick="showText(); return false;">Lees meer</a></p>
        <p class="hiddentext" id="hiddentext">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
    </body>
</html>

Voor mensen zonder javascript zal index.php?action=readmore triggeren. Dan kan je het zo bouwen dat wanneer action == readmore, de hiddentext class niet afgedrukt wordt in je source.

March of the Eagles

dinsdag 8 september 2009 00:02

Acties:

0 Henk 'm!

Verwijderd

Voor mensen zonder javascript zal index.php?action=readmore triggeren. Dan kan je het zo bouwen dat wanneer action == readmore, de hiddentext class niet afgedrukt wordt in je source.

Misschien een stomme vraag, maar als mensen geen javascript ingeschakeld hebben is het dan mogelijk om te controleren op action == readmore? Of is er andere techiek voor?

dinsdag 8 september 2009 00:04

Acties:

0 Henk 'm!

CodeCaster

Can I get uhm...

Verwijderd schreef op dinsdag 08 september 2009 @ 00:02:
[...]

Misschien een stomme vraag, maar als mensen geen javascript ingeschakeld hebben is het dan mogelijk om te controleren op action == readmore? Of is er andere techiek voor?

Om dat de "return false" achter de functie-aanroep ervoor zorgt dat de href niet gevolgd wordt.

Wanneer javascript dan niet uitgevoerd wordt, wordt de URL gevolgd waarna de pagina de volledige tekst laat zien.

[ Voor 12% gewijzigd door CodeCaster op 08-09-2009 00:06 ]

https://oneerlijkewoz.nl
Op papier is hij aan het tekenen, maar in de praktijk...

dinsdag 8 september 2009 00:06

Acties:

0 Henk 'm!

momania

iPhone 30! Bam!

Hij bedoelt denk ik dat je in de nieuwe request dan ook niet via javascript die waarde uit de GET kan halen

Maar met php kan dat natuurlijk weer wel, er vanuit gaande dat de site in php is

[edit]
Snel editten he?

[ Voor 8% gewijzigd door momania op 08-09-2009 00:08 ]

Neem je whisky mee, is het te weinig... *zucht*

dinsdag 8 september 2009 00:09

Acties:

0 Henk 'm!

Verwijderd

CodeCaster schreef op dinsdag 08 september 2009 @ 00:04:
[...]

Om dat de "return false" achter de functie-aanroep ervoor zorgt dat de href niet gevolgd wordt. Wanneer javascript dan niet uitgevoerd wordt, wordt de URL gevolgd waarna de pagina de volledige tekst laat zien.

Ja idd, maar dat wil zeggen dat de mensen die geen javascript hebben wel de link volgen. En daarna, dan kan er toch niet gecontroleerd worden of action == readmore want je kan geen gebruik maken van javascript. Dus die mensen kunnen de extra content niet lezen? Of zie ik het mis?

[edit]
Na vorige edits ben ik dus ook mee

[ Voor 3% gewijzigd door Verwijderd op 08-09-2009 00:11 . Reden: andere edit ]

dinsdag 8 september 2009 08:30

Acties:

0 Henk 'm!

IStealYourGun

Доверяй, но проверяй

Je kan dit met PHP doen maar dit zou gewoon dom zijn.
Javascript met een beetje css is hier veel beter voor geschikt.

PHP == Serverside
JS == Clientside

dinsdag 8 september 2009 09:15

Acties:

0 Henk 'm!

Cartman!

Of je laat standaard de hele tekst zien en als je JS hebt klap je een deel in en toon je een button om de extra tekst te lezen. Ook voor SEO lekkerder dat je pagina direct alle content bevat.

dinsdag 8 september 2009 09:16

Acties:

0 Henk 'm!

IStealYourGun

Доверяй, но проверяй

Cartman! schreef op dinsdag 08 september 2009 @ 09:15:
Of je laat standaard de hele tekst zien en als je JS hebt klap je een deel in en toon je een button om de extra tekst te lezen. Ook voor SEO lekkerder dat je pagina direct alle content bevat.

Dit is eigenlijk de meest correcte manier en hoe ik het zou doen. Je moet altijd er van uitgaan dat mensen geen JS hebben en dan moeten ze alles kunnen zien.

dinsdag 8 september 2009 09:17

Acties:

0 Henk 'm!

Luqq

Als ik jou was zou ik me eens inlezen in jQuery, het UI gedeelte heeft dit soort dingen er standaard inzitten en die hebben ook nog wat leuke animaties aan boord

dinsdag 8 september 2009 09:41

Acties:

0 Henk 'm!

XWB

Devver

Cartman! schreef op dinsdag 08 september 2009 @ 09:15:
Of je laat standaard de hele tekst zien en als je JS hebt klap je een deel in en toon je een button om de extra tekst te lezen.

Dat lijkt mij ook wel de netste manier.

Ook voor SEO lekkerder dat je pagina direct alle content bevat.

Dat bevat mijn voorbeeld toch ook?

Luqq schreef op dinsdag 08 september 2009 @ 09:17:
Als ik jou was zou ik me eens inlezen in jQuery, het UI gedeelte heeft dit soort dingen er standaard inzitten en die hebben ook nog wat leuke animaties aan boord

We gaan 300kb javascript laden om een stukje tekst te kunnen verbergen en weergeven?

[ Voor 31% gewijzigd door XWB op 08-09-2009 09:43 ]

March of the Eagles

dinsdag 8 september 2009 09:46

Acties:

0 Henk 'm!

bonzz.netninja

Niente baffi

Hacku schreef op dinsdag 08 september 2009 @ 09:41:
[...]

We gaan 300kb javascript laden om een stukje tekst te kunnen verbergen en weergeven?

Good point...maar het gebeurt zoooooo veeeeel.

vuistdiep in het post-pc tijdperk van Steve  | Joepie joepie. Dat ging echt toppie! | https://www.dedigitaletuin.nl

dinsdag 8 september 2009 10:16

Acties:

0 Henk 'm!

IStealYourGun

Доверяй, но проверяй

Wat is 300kb anno 2009? Als je dan nog gebruik maakt van de google libarys is de kans groot da het al gecashed is in je browser.

dinsdag 8 september 2009 10:29

Acties:

0 Henk 'm!

Tjolk

300kB is sick veel voor iets wat je met misschien 250 B voor elkaar kunt krijgen. Gewoon zoiets:

JavaScript:

function openOfDicht(id){ 
   if (document.getElementById(id).style.display == "block") { 
      document.getElementById(id).style.display = "none"; 
   } 
   else { 
      document.getElementById(id).style.display = "block"; 
   } 
}

241 bytes en klaar is Kees. Waarom 1000x zoveel gebruiken?

Tjolk is lekker. overal en altijd.

dinsdag 8 september 2009 10:42

Acties:

0 Henk 'm!

bonzz.netninja

Niente baffi

IStealYourGun schreef op dinsdag 08 september 2009 @ 10:16:
Wat is 300kb anno 2009? Als je dan nog gebruik maakt van de google libarys is de kans groot da het al gecashed is in je browser.

Dat is nou dan toch net de essentie van netjes programmeren ipv grote stappen snel thuis

vuistdiep in het post-pc tijdperk van Steve  | Joepie joepie. Dat ging echt toppie! | https://www.dedigitaletuin.nl

dinsdag 8 september 2009 10:57

Acties:

0 Henk 'm!

8088

NaN

Hacku schreef op dinsdag 08 september 2009 @ 09:41:
We gaan 300kb javascript laden om een stukje tekst te kunnen verbergen en weergeven?

Niet dat je geen punt hebt, maar overdrijven is zo flauw. Voor de volledigheid: jQuery 1.3.2 is 117 kB. Minified 'slechts' 55,9 kB.
Sorry, ik heb inderdaad niet goed gelezen.

[ Voor 6% gewijzigd door 8088 op 08-09-2009 11:04 ]

Do you seek to engage in or have you ever engaged in terrorist activities, espionage, sabotage, or genocide?

dinsdag 8 september 2009 10:59

Acties:

0 Henk 'm!

XWB

Devver

8088 schreef op dinsdag 08 september 2009 @ 10:57:
[...]

Niet dat je geen punt hebt, maar overdrijven is zo flauw. Voor de volledigheid: jQuery 1.3.2 is 117 kB. Minified 'slechts' 55,9 kB.

Hij heeft het over jQuery UI: http://jqueryui.com/

450.5 kb uncompressed
~300.03 kb minified

+ nog eens de 50kb jQuery die je nodig hebt.

[ Voor 11% gewijzigd door XWB op 08-09-2009 11:01 ]

March of the Eagles

dinsdag 8 september 2009 11:13

Acties:

0 Henk 'm!

Tjolk

Nog steeds sick. Een standaarpagina met basisfunctionaliteit kost je misschien 150 kB all inclusive. Al die rare meuk van jQuery heb je 9 van de 10 keer niet nodig, dus belast je gebruikers er ook niet mee.

Het is heel gemakkelijk om kant-en-klare oplossingen te gebruiken en voor complexe zaken (complete softwarepakketten) ook best aan te bevelen. Maar voor simpele sites is het meestal aan te bevelen om de boel zelf te schrijven. Dan heb je ten eerste precies wat je nodig hebt en ten tweede heb je geen last van overbodige zaken.

Tjolk is lekker. overal en altijd.

dinsdag 8 september 2009 11:18

Acties:

0 Henk 'm!

NMe

Quia Ego Sic Dico.

Laten we ontopic blijven. Het maakt niet uit hoe groot JQuery, MooTools, of welke andere library dan ook is. Topicstarter vroeg nota bene om een manier om dit zonder CSS te doen, laten we er dan ook maar geen "obscuur framework" bij gaan betrekken.

Cartman! schreef op dinsdag 08 september 2009 @ 09:15:
Of je laat standaard de hele tekst zien en als je JS hebt klap je een deel in en toon je een button om de extra tekst te lezen. Ook voor SEO lekkerder dat je pagina direct alle content bevat.

Het maakt SEO-technisch toch niet uit of je dat zo doet of op de manier die Hacku hierboven uitgewerkt heeft? Het bespaart je hooguit een reload van de pagina omdat je niet op "read all" hoeft te klikken als Javascript uit staat in jouw situatie. Terwijl wat Hacku zegt weer resulteert in een pagina die zowel in grade A browsers als in low grade browsers hetzelfde functioneert, zij het met een reload.

'E's fighting in there!' he stuttered, grabbing the captain's arm.
'All by himself?' said the captain.
'No, with everyone!' shouted Nobby, hopping from one foot to the other.

dinsdag 8 september 2009 11:21

Acties:

0 Henk 'm!

Mike2k

Zone grote vuurbal jonge! BAM!

@Hacku en SFB:
Daarom kan je met jquery UI ook de elementen aangeven die je wil hebben. Wat je niet nodig komt er ook niet in en dus wordt je filesize echt een heel stuk kleiner...

Die 300kb is alleen als je alles selecteert...en dat moet je natuurlijk sowieso niet doen...

@NMe: sorry....won't happen again

[ Voor 7% gewijzigd door Mike2k op 08-09-2009 11:25 ]

You definitely rate about a 9.0 on my weird-shit-o-meter
Chuck Norris doesn't dial the wrong number. You answer the wrong phone.

woensdag 9 september 2009 21:14

Acties:

0 Henk 'm!

Cartman!

NMe schreef op dinsdag 08 september 2009 @ 11:18:
Het maakt SEO-technisch toch niet uit of je dat zo doet of op de manier die Hacku hierboven uitgewerkt heeft? Het bespaart je hooguit een reload van de pagina omdat je niet op "read all" hoeft te klikken als Javascript uit staat in jouw situatie. Terwijl wat Hacku zegt weer resulteert in een pagina die zowel in grade A browsers als in low grade browsers hetzelfde functioneert, zij het met een reload.

Als je spider op je site komt mis je eerst een groot deel content, pas bij een extra get-var zal de extra content komen. Hij zal t wel vinden maar direct in 1 keer vind ik persoonlijk 'slimmer'. Dan werkt het ook voor iedereen.

[ Voor 15% gewijzigd door Cartman! op 09-09-2009 21:15 ]

donderdag 10 september 2009 00:23

Acties:

0 Henk 'm!

NMe

Quia Ego Sic Dico.

Cartman! schreef op woensdag 09 september 2009 @ 21:14:
[...]

Als je spider op je site komt mis je eerst een groot deel content, pas bij een extra get-var zal de extra content komen. Hij zal t wel vinden maar direct in 1 keer vind ik persoonlijk 'slimmer'. Dan werkt het ook voor iedereen.

Ehm, de content staat er gewoon, alleen met een display: hidden erop.

Alles wat die get-var doet is de display: hidden weghalen.

'E's fighting in there!' he stuttered, grabbing the captain's arm.
'All by himself?' said the captain.
'No, with everyone!' shouted Nobby, hopping from one foot to the other.

donderdag 10 september 2009 08:33

Acties:

0 Henk 'm!

Tjolk

Jep.

En display doet helemaal niets voor SEO bij mijn weten.

Tjolk is lekker. overal en altijd.

vrijdag 11 september 2009 21:43

Acties:

0 Henk 'm!

Cartman!

Ah, ik begreep dat je em niet zou renderen dan

Maareh.. vallen spiders er niet over als je veel content display:none zet? Dat was jaren geleden nogal een ding volgens mij om extra content mee te laten spideren zonder dat je bezoekers t zagen.