Spring naar inhoud

Guest's Foto
Welkom,
Guest
Wenst u zich te registreren?


Foto
- - - - -

Slideshow in html.


  • Dit onderwerp is gesloten Dit onderwerp is gesloten
24 reacties op dit onderwerp

#1 manu123

manu123

    Lid

  • Lid
  • PipPipPip
  • 87 berichten

Geplaatst 29 maart 2012 - 17:17


Hallo,Ik ben bezig met het maken van een nieuwe website en zou graag een slideshow op mijn welkom pagina hebben (zoals die van PC Helpforum - Gratis hulp bij computer problemen maar dan zonder de tekst aan de rechterkant en met andere foto's natuurlijk).

Het probleem is ik moet mijn welkom's pagina maken in een tekst vak (zie foto).tekst vak website.jpg

Ik kan met de knop links boven HTML codes invoeren maar ik kan niet aan de volledige codes van de website.

Met wat te googlen had ik codes gevonden maar dan moet je nog codes toevoegen aan de haed maar die kan ik niet wijzigen.

Is het mogelijk om een slideshow toe te voegen met codes die ik enkel in het tekst vak moet schrijven?

Bewerkt door manu123, 29 maart 2012 - 18:37.


#2 stegisoft

stegisoft

    Super Moderator

  • Super Moderator
  • 27423 berichten

Geplaatst 29 maart 2012 - 18:00

Hier staat uitleg hoe je zoiets moet maken.

#3 manu123

manu123

    Lid

  • Lid
  • PipPipPip
  • 87 berichten

Geplaatst 29 maart 2012 - 18:36



Bedankt voor je snelle reactie.

De site die je gaf is inderdaad wat ik bedoel maar daar moet je ook de html codes plakken achter head en dat is bij mij niet mogelijk.

Is er een manier hoe ik zo'n slideshow toch kan toevoegen maar dan alleen met codes toe te voegen in het tekstvak.

#4 stegisoft

stegisoft

    Super Moderator

  • Super Moderator
  • 27423 berichten

Geplaatst 29 maart 2012 - 18:45

Waarom zou je geen code kunnen toevoegen?
Dat zou normaal gezien op elke website moeten kunnen.

#5 manu123

manu123

    Lid

  • Lid
  • PipPipPip
  • 87 berichten

Geplaatst 29 maart 2012 - 18:57

Sorry ben ik vergeten te vermelden:

Ik huur de website (een webshop) van 123webshop.
Achter de website zit een admin paneel waar je producten kan toevoegen.
Je kan ook tekst pagina's toevoegen maar dan moet je de tekst in een tekst vak schrijven (zie foto 1ste post).
Er is een optie waar je html codes kan ingeven maar dat is enkel voor de tekst pagina's.
De volledige codes van de site kan ik niet wijzigen.

Is er een mogelijkheid om een slideshow te maken met codes die ik alleen moet ingeven in dat tekst vak?

Bewerkt door manu123, 30 maart 2012 - 21:36.


#6 stegisoft

stegisoft

    Super Moderator

  • Super Moderator
  • 27423 berichten

Geplaatst 29 maart 2012 - 23:54

Tekstpagina's opmaken via tekstverwerker heb ik gezien bij veel gestelde vragen.
ik weet niet of je daar code kan ingeven.
Maar zo te zien heb je weinig mogelijkheden.
Het is uiteraard de bedoeling dat je niet zit te prutsen aan de webwinkel.

#7 manu123

manu123

    Lid

  • Lid
  • PipPipPip
  • 87 berichten

Geplaatst 30 maart 2012 - 00:00

Je kan inderdaad codes in een tekstpagina invoeren.

Is het dan mogelijk om een slideshow te maken met enkel daar codes in te voegen?

Of zijn er andere manieren om een slideshow toetevoegen aan een tekst pagina?

#8 stegisoft

stegisoft

    Super Moderator

  • Super Moderator
  • 27423 berichten

Geplaatst 30 maart 2012 - 00:07

Ziet je in de tekstpagina ook andere code?

#9 manu123

manu123

    Lid

  • Lid
  • PipPipPip
  • 87 berichten

Geplaatst 30 maart 2012 - 00:10

Als je in een lege tekst pagina op code klikt dan staat er niets.

#10 stegisoft

stegisoft

    Super Moderator

  • Super Moderator
  • 27423 berichten

Geplaatst 30 maart 2012 - 00:14



Dan zal het niet lukken, vrees ik.
Best contact nemen met 123webshop of zij dat willen doen maar ik vrees dat je er voor moet betalen.

#11 manu123

manu123

    Lid

  • Lid
  • PipPipPip
  • 87 berichten

Geplaatst 30 maart 2012 - 00:18

Oke ik zal contact opnemen met 123webshop.

Bedankt voor al je hulp.

#12 stegisoft

stegisoft

    Super Moderator

  • Super Moderator
  • 27423 berichten

Geplaatst 30 maart 2012 - 00:24

Laat maar horen wat 123webshop zegt.

#13 ecence

ecence

    Lid

  • Lid
  • PipPipPip
  • 229 berichten

Geplaatst 30 maart 2012 - 06:42

Ik heb even gekeken, en je moet inderdaad 1 regeltje in de head toevoegen, nu heb je een bult geluk,

die regel is eigenlijk gewoon een stukje code van Jquery, als je de javascript codes die daar staan, + een bijpassende jquery code vindt, of alleen jquery, kun je die slideshow gewoon maken, zonder dat je in de head hoeft te komen.

bij die tutorial is de Jquery alleen al gedaan en daar voor moet je linken in de head, maar omdat jij dit niet kan moet je proberen de jquery zelf te maken.

---------- Post toegevoegd om 07:42 ---------- Vorige post was om 07:39 ----------

even iets beter gekeken, je kunt de jquery code bemachtigen via deze link http://ajax.googleap...0/jquery.min.js

1 belangrijk ding waar je aan moet denken is dat het dan javascript is dus je neemt alle tekst die op die pagina staat, en zet daaromheen

<script type="text/javascript">

===== die code van die pagina =====

</script>

en dan ga je verder.

maar om dat ding helemaal op je website te gaan zetten (weet niet 100% zeker of dat wel lukt, denk het wel), ziet er niet echt handig uit, misschien kan het wel.

ps: als je deze code erin zet, moet je daaronder
deze code zetten.

<style type="text/css">


/*Make sure your page contains a valid doctype at the top*/
#simplegallery1{ //CSS for Simple Gallery Example 1
position: relative; /*keep this intact*/
visibility: hidden; /*keep this intact*/
border: 10px solid darkred;
}


#simplegallery1 .gallerydesctext{ //CSS for description DIV of Example 1 (if defined)
text-align: left;
padding: 2px 5px;
}


</style>


<script type="text/javascript" src="simplegallery.js">


/***********************************************
* Simple Controls Gallery- © Dynamic Drive DHTML code library (Dynamic Drive DHTML(dynamic html) & JavaScript code library)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at Dynamic Drive DHTML(dynamic html) & JavaScript code library for this script and 100s more
***********************************************/


</script>


<script type="text/javascript">


var mygallery=new simpleGallery({
wrapperid: "simplegallery1", //ID of main gallery container,
dimensions: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of the images exactly
imagearray: [
["http://i26.tinypic.com/11l7ls0.jpg", "http://en.wikipedia.org/wiki/Swimming_pool", "_new", "There's nothing like a nice swim in the Summer."],
["http://i29.tinypic.com/xp3hns.jpg", "http://en.wikipedia.org/wiki/Cave", "", ""],
["http://i30.tinypic.com/531q3n.jpg", "", "", "Eat your fruits, it's good for you!"],
["http://i31.tinypic.com/119w28m.jpg", "", "", ""]
],
autoplay: [true, 2500, 2], //[auto_play_boolean, delay_btw_slide_millisec, cycles_before_stopping_int]
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
oninit:function(){ //event that fires when gallery has initialized/ ready to run
//Keyword "this": references current gallery instance (ie: try this.navigate("play/pause"))
},
onslide:function(curslide, i){ //event that fires after each slide is shown
//Keyword "this": references current gallery instance
//curslide: returns DOM reference to current slide's DIV (ie: try alert(curslide.innerHTML)
//i: integer reflecting current image within collection being shown (0=1st image, 1=2nd etc)
}
})


</script>

daarna moet je vanaf step2: van deze pagina: Dynamic Drive DHTML Scripts- Simple Controls Gallery
verder gaan met de slideshow, met een beetje geluk lukt het je.




ps: al deze code kan gewoon in je body net zoals je zocht!!

Bewerkt door ecence, 30 maart 2012 - 06:44.


#14 manu123

manu123

    Lid

  • Lid
  • PipPipPip
  • 87 berichten

Geplaatst 30 maart 2012 - 09:50

Ik heb het geprobeerd maar er gebeurt niets.
Als ik het opsla en op de pagina kijk is de pagina leeg.

Ik denk dat ik iets verkeerd doe maar ik weet niet wat.
Kan je in je volgende post de volledige code geven dat ik in het tekstvak moet schrijven a.u.b.

#15 manu123

manu123

    Lid

  • Lid
  • PipPipPip
  • 87 berichten

Geplaatst 30 maart 2012 - 11:11

Ik heb net een mail van 123webshop ontvangen.

Het is wel mogelijk om de codes te wijzigen achter de head dat moet via het vak Globale scripts.

Als ik de codes in dat vak kopieer gebeurt er niets.

Dit zijn de codes dat ik gekopieert heb naar globale scripts:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>

<style type="text/css">


/*Make sure your page contains a valid doctype at the top*/
#simplegallery1{ //CSS for Simple Gallery Example 1
position: relative; /*keep this intact*/
visibility: hidden; /*keep this intact*/
border: 10px solid darkred;
}


#simplegallery1 .gallerydesctext{ //CSS for description DIV of Example 1 (if defined)
text-align: left;
padding: 2px 5px;
}


</style>


<script type="text/javascript" src="simplegallery.js">


/***********************************************
* Simple Controls Gallery- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/


</script>


<script type="text/javascript">


var mygallery=new simpleGallery({
    wrapperid: "simplegallery1", //ID of main gallery container,
    dimensions: [649, 350], //width/height of gallery in pixels. Should reflect dimensions of the images exactly
    imagearray: [
        ["WEBSITE WAAR DE AFBEELDING STAAT", "", "", ""],
        ["WEBSITE WAAR DE AFBEELDING STAAT", "", "", ""],
    ],
    autoplay: [true, 2500, 2], //[auto_play_boolean, delay_btw_slide_millisec, cycles_before_stopping_int]
    persist: false, //remember last viewed slide and recall within same session?
    fadeduration: 500, //transition duration (milliseconds)
    oninit:function(){ //event that fires when gallery has initialized/ ready to run
        //Keyword "this": references current gallery instance (ie: try this.navigate("play/pause"))
    },
    onslide:function(curslide, i){ //event that fires after each slide is shown
        //Keyword "this": references current gallery instance
        //curslide: returns DOM reference to current slide's DIV (ie: try alert(curslide.innerHTML)
        //i: integer reflecting current image within collection being shown (0=1st image, 1=2nd etc)
    }
})


</script>

Op de plek waar "WEBSITE WAAR DE AFBEELDING STAAT" staat, daar zet ik de site van mijn afbeelding.

En dit heb ik gekopieerd naar het tekst vak waar ik de slideshow graag zou willen:
<div id="simplegallery1"></div>

Op de website staat ook dat je simplegallery.js moet downloaden.
Maar ik weet niet waar ik dat moet zetten op mijn website.

Bewerkt door manu123, 30 maart 2012 - 11:18.


#16 stegisoft

stegisoft

    Super Moderator

  • Super Moderator
  • 27423 berichten

Geplaatst 30 maart 2012 - 12:08

simplegallery.js dient je te plaatsen waar de pagina staat waar je code wilt in zetten.

#17 manu123

manu123

    Lid

  • Lid
  • PipPipPip
  • 87 berichten

Geplaatst 30 maart 2012 - 12:34

Hoe moet ik dat bestandje daar in plaatsen?

#18 stegisoft

stegisoft

    Super Moderator

  • Super Moderator
  • 27423 berichten

Geplaatst 30 maart 2012 - 15:03

Waarschijnlijk bij 'Content beheren' > 'Bestanden beheren'

#19 ecence

ecence

    Lid

  • Lid
  • PipPipPip
  • 229 berichten

Geplaatst 30 maart 2012 - 15:06

normaalgesproken zou je bestanden op de root van je website kunnen zetten, het begin. maar omdat jij een websiteeditor hebt, kun je daar waarschijnlijk niet bij komen, Misschien wel kijk naar stegisoft's info.

je moet proberen om ergens bestanden te uploaden, waarschijnlijk kun je die optie wel ergens vinden.

open eerst je kladblok en plaats daarin alle tekst van simplegallery.js, sla deze op onder de naam simplegallery.js (dezelfde! is erg belangrijk).

ga dan naar je host (website editor) en kijk of je ergens om 1 of andere manier bestanden kan toevoegen.

als dat kan voeg je dat bestand toe (simplegallery.js) en dan moet je goed kijken waar je het precies opslaat, misschien wordt er een path gegeven bijvoorbeeld.

www.website32.nl/bestanden/simplegallery.js

aan dat path kun je dus zien waar je bestand om de website staat.

als dit alles gelukt is kopieer je dat path, dus in het voorbeeld geval www.website32.nl/bestanden/simplegallery.js

dan verander je in je bestand (javascript code) voor de slide image.



<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script><style type="text/css">/*Make sure your page contains a valid doctype at the top*/#simplegallery1{ //CSS for Simple Gallery Example 1position: relative; /*keep this intact*/visibility: hidden; /*keep this intact*/border: 10px solid darkred;}#simplegallery1 .gallerydesctext{ //CSS for description DIV of Example 1 (if defined)text-align: left;padding: 2px 5px;}</style>

dit verander je dan!!!!

<script type="text/javascript" src="www.website32.nl/bestanden/simplegallery.js">


/************************************************ Simple Controls Gallery- © Dynamic Drive DHTML code library (www.dynamicdrive.com)* This notice MUST stay intact for legal use* Visit Dynamic Drive at Dynamic Drive DHTML(dynamic html) & JavaScript code library for this script and 100s more***********************************************/</script><script type="text/javascript">var mygallery=new simpleGallery({ wrapperid: "simplegallery1", //ID of main gallery container, dimensions: [649, 350], //width/height of gallery in pixels. Should reflect dimensions of the images exactly imagearray: [ ["WEBSITE WAAR DE AFBEELDING STAAT", "", "", ""], ["WEBSITE WAAR DE AFBEELDING STAAT", "", "", ""], ], autoplay: [true, 2500, 2], //[auto_play_boolean, delay_btw_slide_millisec, cycles_before_stopping_int] persist: false, //remember last viewed slide and recall within same session? fadeduration: 500, //transition duration (milliseconds) oninit:function(){ //event that fires when gallery has initialized/ ready to run //Keyword "this": references current gallery instance (ie: try this.navigate("play/pause")) }, onslide:function(curslide, i){ //event that fires after each slide is shown //Keyword "this": references current gallery instance //curslide: returns DOM reference to current slide's DIV (ie: try alert(curslide.innerHTML) //i: integer reflecting current image within collection being shown (0=1st image, 1=2nd etc) }})</script>


sorry het komt er niet zo lekker op, maar je kunt het haast wel raden.

Bewerkt door ecence, 30 maart 2012 - 15:09.


#20 manu123

manu123

    Lid

  • Lid
  • PipPipPip
  • 87 berichten

Geplaatst 30 maart 2012 - 16:04

Als ik dat bestandje wil uploaden dan krijg ik deze foutmelding:

File extension not allowed in this folder.

In andere mappen gaat het ook niet.

Bewerkt door manu123, 30 maart 2012 - 16:21.





0 gebruiker(s) lezen dit onderwerp

0 leden, 0 gasten, 0 anonieme gebruikers

Over ons

PC Helpforum helpt GRATIS computergebruikers sinds juli 2006. Ons team geeft via het forum professioneel antwoord op uw vragen en probeert uw pc problemen zo snel mogelijk op te lossen. Word lid vandaag, plaats je vraag online en het PC Helpforum-team helpt u graag verder!