Notifikationer

Markér alle som læst Log ud

junold Nybegynder

04. april 2008 - 08:27 Der er 22 kommentarer og
1 løsning

Popup text, hvordan?

Jeg søger et script (tror det er java) hor man kan klikke på en tekst, og så bliver den vist. Jeg har set nogen steder, hvor kanterne af skærmen fader ud, og teksten kommer i en boks på midten af skærmen.

Jeg skal bruge det til nyhederne her:
http://click2create.dk/index.php?type=content&id=2
Så når man klikker på en nyhed, vises hele nyheden i en boks på skærmen.

Nogen gode ideer?

Synes godt om

w13 Novice

04. april 2008 - 09:47 #1

Skal det være i et nyt vindue, dvs. et regulært popup-vindue, eller skal det bare vises i et layer på siden?
Og hvis det skal være layer, skal det så vises midt på skærmen eller skal det følge musen eller hvad?

Synes godt om

junold Nybegynder

04. april 2008 - 11:41 #2

Det må gerne være et layer på siden. Og det skal bare vises midt på skærmen, og med mulighed for at lukke tekstboksen igen.

Synes godt om

w13 Novice

04. april 2008 - 12:36 #3

Jeg laver ikke noget fancy fade, da jeg ikke helt ved, hvad du mener, og hvordan det skulle laves.
Men du kan selv style boksen "showtext":
-------------------------------------------------------
<html>
<head></head>
<body>

<script type="text/javascript">
function ShowText(s){
o=document.getElementById("showtext");
o.firstChild.nodeValue=s;
o.style.display=o.style.display!="block"?"block":"none";
}
</script>

<div id="showtext" style="width:200px;height:200px;position:absolute;top:40%;left:40%;padding:10px;border:1px solid #000;display:none"> </div>

<span style="cursor:pointer" onclick="ShowText('Nyhedstekst her... Og mere tekst her!')">Nyhedstekst her...</span>

</body>
</html>

Synes godt om

w13 Novice

04. april 2008 - 12:39 #4

Selvfølgelig et meget simpelt eksempel, men så kan vi ta' den derfra.

Synes godt om

junold Nybegynder

04. april 2008 - 13:07 #5

Ok, jeg roder lige lidt med at få det ind på siden. Skriver når jeg har noget, så kan du lige se det, og vurdere. :)

Synes godt om

junold Nybegynder

04. april 2008 - 13:24 #6

Ok, jeg skal bruge det i PHP i en echo sætning. Den er her:
echo '<tr><td class="tdheadline"><p><strong>'.$tmpHeadline.'</strong> Oprettet: '.substr($tmpCreateTimeStamp,0,10).'</p> <p align="right">Skrevet af: '.$tmpData[0]['username'].'</p></td></tr><tr onClick="ShowText(\''.$tmpContent.'\')"; onMouseOver="this.className= \'hoverline\'" onmouseout="this.className=\''.$class.'\'" class="'.$class.'"><td>'.substr($tmpContent,0,130).'</td></tr><tr><td> </td></tr>';

Og mit stylesheet ser sådan her ud:
/* ******** CONTENT START ********* */
.content {
background-color: white;
text-align:left;
margin-bottom:40px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
}

.content #contentheader {
width:100%;
}

.content #showtext {
background-color:#000;
width:200px;
height:200px;
position:absolute;
top:40%;
left:40%;
padding:10px;
border:1px solid #000;
display:none

}

Men det virker ikke helt efter hensigten! Det er kun nogen af teksterne der vises, og det ser ikke ud til at CSS kører som det skal?

Synes godt om

w13 Novice

04. april 2008 - 13:41 #7

Jeg tror lige, vi må gøre lidt anderledes.

For hver nyhed, skal du vise hele teksten i en span sådan her:

<span id="news1" style="display:none">Her er hele nyhedsteksten for id1 skjult</span>

<span id="news2" style="display:none">Her er hele nyhedsteksten for id2 skjult</span>

Og så brug min kode sådan her:

<html>
<head></head>
<body>

<script type="text/javascript">
function ShowText(id){
id=document.getElementById(id);
o=document.getElementById("showtext");
o.style.display=(o.style.display!="block"||o.innerHTML!=id.innerHTML)?"block":"none";
o.innerHTML=id.innerHTML;
}
</script>

<div id="showtext" style="width:200px;height:200px;position:absolute;top:40%;left:40%;padding:10px;border:1px solid #000;display:none"></div>

<span style="cursor:pointer" onclick="ShowText('news1')">Nyhedstekst her...</span>
<span id="news1" style="display:none">Her er hele nyhedsteksten for id1 skjult</span>

</body>
</html>

Synes godt om

junold Nybegynder

04. april 2008 - 13:45 #8

Prøv at gå ind og se den nu. Fik css'en til at køre. Det eneste er, at den ikke kan vise alle teksterne, men jeg tror det er fordi der er " i dem? Ville det måske fungere hvis jeg udskifter alle " med \" ?

Synes godt om

junold Nybegynder

04. april 2008 - 13:45 #9

Hver linje køres i en foreach lykke, så den bliver kørt ligeså mange gange som der er nyheder. :)

Synes godt om

w13 Novice

04. april 2008 - 13:46 #10

Det er bedre, hvis du bruger min nye kode. Der kan opstå for mange fejl i den anden.

I den nye laver vi nogle "beholdere" til nyhedernes fulde versioner, og skjuler disse. På den måde kan vi hive indholdet ud af dem og indsætte det i ShowText-boksen.

Synes godt om

junold Nybegynder

04. april 2008 - 13:52 #11

Vil den så også kunne vise " og sådanne tegn?

Synes godt om

w13 Novice

04. april 2008 - 13:53 #12

Den vil kunne vise alt. =)

Synes godt om

w13 Novice

04. april 2008 - 13:55 #13

Så skal onclick'erne bare hedde onclick="ShowText('id-et på det element, som indeholder nyheden')"

Synes godt om

junold Nybegynder

04. april 2008 - 14:09 #14

Hehe ja man skal holde tungen lige i munden med den linje den skal lave!
prøv at gå ind og se hvordan det ser ud nu... Og kan man ikke lave det så man skal klikke i boksen for at lukke den, og ikke på en nyhed?

Synes godt om

w13 Novice

04. april 2008 - 14:11 #15

Jo, bare tilføj denne onclick på showtext-boksen:

onclick="this.style.display='none'"

Synes godt om

w13 Novice

04. april 2008 - 14:12 #16

Evt. også style="cursor:pointer" så man kan se, man kan klikke for at lukke.

Synes godt om

junold Nybegynder

04. april 2008 - 14:30 #17

Ok, prøv at se nu. :)

Synes godt om

w13 Novice

04. april 2008 - 14:37 #18

Jep :)

Synes godt om

junold Nybegynder

04. april 2008 - 14:50 #19

Det var sådan set lige det jeg ledte efter! Super! Mange tak for hjælpen.

Synes godt om

junold Nybegynder

14. april 2008 - 10:30 #20

w13 Kan vi evt tale på msn? Har lige et par spm. mht koden. :)

Synes godt om

w13 Novice

14. april 2008 - 10:33 #21

Det gør jeg generelt ikke.
Så hellere at du stiller dem herinde.

Synes godt om

junold Nybegynder

14. april 2008 - 11:04 #22

OK, jeg opretter den som nyt spm, så du kan få point for det.. :)

Synes godt om

junold Nybegynder

14. april 2008 - 19:36 #23

Ok jeg har oprettet dette:
http://www.eksperten.dk/spm/827820

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
problem med download i <a href=" " download> tag i JavaScript Af Peer i JavaScript	4	27/04/202620:09	I går 22:36
Validering af filnavn i formular Af Strawberry i JavaScript	8	14/04/202610:11	20/04/202611:14
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript	2	03/02/202614:19	04/04/202616:02
Åbne en PDF fil fra en mappe Af mbl i JavaScript	9	18/04/202516:52	22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript	2	14/02/202511:47	27/06/202514:34

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS