• Login
  • Register
  • Zoek
Everywhere
  • Everywhere
  • Articles
  • Pages
  • Forum
  • Filebase Entry
  • More Options

ICTscripters

Dé plek voor IT

Dé plek voor IT

Login

Geavanceerde opties
  1. Home
  2. Forum
    1. Alle berichten
    2. Recente activiteiten
  3. ICT Nieuws
  4. Blog
  5. Marktplaats
    1. Werk
    2. Advertenties
    3. Domeinnamen
    4. Websites
    5. Design & lay-outs
    6. Scripts
    7. Overige
  6. Design
  7. Leden
    1. Actieve bezoekers
    2. Team
    3. Leden zoeken
  8. Downloads
  9. Goedkope domeinnamen
  1. Home
  2. Forum
    1. Alle berichten
    2. Recente activiteiten
  3. ICT Nieuws
  4. Blog
  5. Marktplaats
    1. Werk
    2. Advertenties
    3. Domeinnamen
    4. Websites
    5. Design & lay-outs
    6. Scripts
    7. Overige
  6. Design
  7. Leden
    1. Actieve bezoekers
    2. Team
    3. Leden zoeken
  8. Downloads
  9. Goedkope domeinnamen
  1. Home
  2. Forum
    1. Alle berichten
    2. Recente activiteiten
  3. ICT Nieuws
  4. Blog
  5. Marktplaats
    1. Werk
    2. Advertenties
    3. Domeinnamen
    4. Websites
    5. Design & lay-outs
    6. Scripts
    7. Overige
  6. Design
  7. Leden
    1. Actieve bezoekers
    2. Team
    3. Leden zoeken
  8. Downloads
  9. Goedkope domeinnamen
  1. Dé plek voor IT - ICTscripters
  2. Leden
  3. TheBosS

Forum

  • Na 15 jaar terug van weggeweest: iCriminals.nl is terug (BETA)!

    Syntax 23 december 2025 om 16:43
  • Developer Gezocht

    tcbhome 21 december 2025 om 15:07
  • Op zoek naar de legends

    Jeffrey.Hoekman 9 december 2025 om 09:41
  • [FREE] WeFact Hosting module

    Jeroen.G 13 oktober 2025 om 14:09
  • Help testers nodig voor android app Urgent

    urgentotservices 26 september 2025 om 10:21
  • Versio vervanger

    Jeroen.G 25 augustus 2025 om 15:56
  • Afspraken systeem met planbeperking

    Lijno 1 augustus 2025 om 23:04
  • Partner Gezocht om meerdere NFT Collecties op Open Sea te Plaatsen

    NFT Art Designer 1 maart 2025 om 14:08

Marktplaats

  • Meerdere mafia game template te koop

    Syntax 28 december 2025 om 21:20
  • Van een pixelige afbeelding naar een strakke, moderne website

    Syntax 21 december 2025 om 17:05
  • 302 Nieuwe Domeinnamen November 2025

    shiga 1 december 2025 om 13:07

Posts by TheBosS

  • htaccess rewrite

    • TheBosS
    • 18 januari 2015 om 16:32

    Beste FangorN,

    Alvast heel erg bedankt voor je reactie. Ik ga het even op mijn gemak doornemen om vervolgens met je tips aan de slag te kunnen. Haha ja ik maak gebruik van PHP. Ik heb inmiddels een 2 index gemaakt een dubbele x omdat in mijn eerste mijn header location staat.

    Edit misschien is het makkelijker als ik de desbetreffende website er ook bij post, zodat met een idee heeft wat ik verkeerd doe:

    Future House Music

  • htaccess rewrite

    • TheBosS
    • 18 januari 2015 om 12:54

    Goede middag heren,

    Ik loop op dit moment vast met het maken van friendly urls. Op dit moment probeer ik via een .htaccess bestand friendly urls te maken door inplaats van mijn huidige urls: index.php?page=home het volgende te maken /home. Kortom ik wil dat index.php?page= niet meer weergegeven wordt. Nu staan er tal van tutorials online en heb ik al meerdere dingen geprobeerd echter veranderd er bij mij niets. Ik heb zelfs de tutorial van mijn hosting provider: "Pcextreme" gebruikt en dat veranderde ook niks. Wat doe ik fout?


    Apache Configuration
    RewriteEngine On
    RewriteBase /
    RewriteRule ^([a-zA-Z0-9]+)/$ index.php?page=$home

    Alvast bedankt voor jullie tijd en moeite.

  • Afgerond!(topic mag gesloten worden)

    • TheBosS
    • 10 januari 2015 om 16:44

    Ik ben op dit moment bezig om mijn jplayer aan te passen zodat ik met een while loop tracks kan laden uit de database echter komt ik er niet helemaal uit. Ik weet namelijk niet hoe ik de while loop maak als er een stuks javascript aan te pas komt. De scripts die ik heb staan hieronder:

    Player Frontend:

    Code
    <div class="players cf">
                    <div class="players-col players-col_left">
                        <div class="short-player cf">
                            <div id="jquery_jplayer_1" class="jp-jplayer"></div>
                            <div id="jp_container_1" class="jp-audio">
                                <div class="jp-type-single cf">
                                    <div class="jp-gui jp-interface">
                                        <ul class="jp-controls">
                                            <li><a href="javascript:;" class="jp-play" tabindex="1">play</a></li>
                                            <li><a href="javascript:;" class="jp-pause" tabindex="1">pause</a></li>
                                        </ul>
                                    </div>
                                    <div class="jp-details">
                                        <ul>
                                            <li><span class="jp-title"></span></li>
                                        </ul>
                                    </div>
                                    <div class="jp-no-solution">
                                        <span>Update Required</span>
                                        To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
                                    </div>
                                </div>
                            </div>
                        </div>
    Toon Meer

    Player Backend:

    Code
    <script>
            $(document).ready(function(){
                $("#jquery_jplayer_1").jPlayer({
                    ready: function () {
                        $(this).jPlayer("setMedia", {
                            title: "LMFAO - Party Rock Anthem ft. Lauren Bennett, GoonRock",
                            m4a: "http://www.jplayer.org/audio/m4a/Miaow-07-Bubble.m4a",
                            oga: "http://www.jplayer.org/audio/ogg/Miaow-07-Bubble.ogg"
                        });
                    },
                    swfPath: "/js",
                    supplied: "m4a, oga"
                });
                /* End player 1 */
    </script>
    Toon Meer


    Nu is mijn doel om het dynamische te maken via een whileloop maar ik loop vast op het javascript gedeelte:

    PHP
    <?php
                            $sql=mysql_query("SELECT * FROM tracks ORDER BY id DESC");
                            while($row=mysql_fetch_array($sql)){
                        
                            $id = $row['id'];
                            $title = $row['title'];
                            $datetime = $row['datetime'];
                            $youtube = $row['youtube'];
                            $text = $row['text']; 
                            $author = $row['author'];
                            $tags =    $row['tags'];
                            ?>
    Toon Meer

    Hopelijk kan iemand mij hier mee helpen want ik ben er 2 weken mee bezig en zit nog steeds met het zelfde probleem. Alvast bedankt voor de tijd en moeite. Ps misschien helpt dit: dit is de pagina waarom het gaat: Future House Music

  • *Afgerond* Dropdown in een Responsive navigatie maken

    • TheBosS
    • 8 december 2014 om 07:19

    Heey nog bedankt voor je reactie, echter had ik het al opgelost. Ik had namelijk mijn 2e ul element over het hoofd gezien in de css. Ik heb dit Voor de mensen die dit probleem ook hadden heb ik nu dit toegevoegd aan mijn css:

    Code
    ul#navigation li:hover > ul
    {
        visibility:visible;
        opacity:1;
    }
    
    
    ul#navigation ul, ul#navigation ul li ul {
        list-style: none;
        margin: 0;
        padding: 0;    
        visibility:hidden;
        position: absolute;
        z-index: 99999;
        background:#f8f8f8;
        box-shadow:1px 1px 3px #ccc;
        opacity:0;
        -webkit-transition:opacity 0.2s linear, visibility 0.2s linear; 
        -moz-transition:opacity 0.2s linear, visibility 0.2s linear; 
        -o-transition:opacity 0.2s linear, visibility 0.2s linear; 
        transition:opacity 0.2s linear, visibility 0.2s linear;     
    }
    
    
    ul#navigation ul {
        top: 43px;
        left: 1px;
    }
    
    
    ul#navigation ul li ul {
        top: 0;
        left: 181px;
    }
    
    
    ul#navigation ul li {
        clear:both;
        width:100%;
        border:0 none;
        border-bottom:1px solid #c9c9c9;
    }
    
    
    ul#navigation ul li a {
        background:none;
        padding:7px 15px;
        color:#616161;
        text-shadow:1px 1px 0px #fff;
        text-decoration:none;
        display:inline-block;
        border:0 none;
        float:left;
        clear:both;
        width:102px;
    }
    
    
    ul#navigation li a.first {
        border-left: 0 none;
    }
    
    
    ul#navigation li a.last {
        border-right: 0 none;
    }
    Toon Meer
  • *Afgerond* Dropdown in een Responsive navigatie maken

    • TheBosS
    • 6 december 2014 om 14:44

    Beste ICT Scripters,

    Ik ben bezig met een website voor een bekende, nu moet ik in mijn responsive menu een dropdown maken, normaal gezien niet zo moeilijk maar ik ben er een behoorlijke tijd uitgeweest nu probeerde in door middel van visibility: hidden; dit te maken maar dat werkte niet.

    Nu heb ik mijn wijzigingen in de css weer weghaald voor dit dropdown menu omdat dit niet werkten. Ik hoop dat iemand mij wil helpen, Alvast bedankt voor moeite.

    Hieronder staat de code voor mijn navigatie en voor mijn css.

    Code
    <nav class="nav">
                    <ul>
                        <li><a href="futurehouse.php" class="nav__item">Future House</a></li>
                        <li><a href="#" class="nav__item">Music</a>
                            <ul>
                                <li><a href="tracks.php" class="nav_sub_item">Tracks</a></li>
                                <li><a href="podcast.php" class="nav_sub_item">Podcast</a></li>
                            </ul>
                        </li>
                        <li><a href="artist.php" class="nav__item">Artists</a></li>
                        <li><a href="tour.php" class="nav__item">Events</a></li>
                        <li><a href="#" class="nav__item">Media</a>
                            <ul>
                                <li><a href="Photos.php" class="nav_sub_item">Photos</a></li>
                                <li><a href="videos.php" class="nav_sub_item">Videos</a></li>
                            </ul>
                        </li>
                        <li><a href="contact.php" class="nav__item">Contact</a></li> 
                    </ul>
                </nav>
    Toon Meer
    Code
    .nav {
      float: right;
      width: 68.7384044527%;
      background: url(images/mainNavShadow.png) no-repeat top center;
      margin-right: -35px;
      position:relative;
    }
    .nav__item {
      display: inline-block;
      font: 1.5em "Dosis", sans-serif;
      color: #ffffff;
      margin-left: -4px;
      padding: 4.453441% 4.38596491228% 5.5%;
      border-left: 1px solid #050505;
      -webkit-box-shadow: -1px 0 0 rgba(255, 255, 255, 0.1);
      -moz-box-shadow: -1px 0 0 rgba(255, 255, 255, 0.1);
      box-shadow: -1px 0 0 rgba(255, 255, 255, 0.1);
      -webkit-transition: all 0.2s;
      -moz-transition: all 0.2s;
      -ms-transition: all 0.2s;
      -o-transition: all 0.2s;
      transition: all 0.2s;
    }
    .nav__item:hover {
      background: #151515;
      color: #082f36;
    }
    .nav__item.nav__item_active {
      background: #151515;
      color: #082f36;
    }
    .btn-nav-toggle {
      display: none;
      width: 100%;
      font: bold 1.33333333em "Dosis", sans-serif;
      color: #082f36;
      text-transform: uppercase;
      padding: 1.30208333333%;
      background: #000;
      -webkit-box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.2);
      -moz-box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.2);
      box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.2);
    }
    .btn-nav-toggle:before {
      content: "";
      display: inline-block;
      margin-right: 7px;
      vertical-align: -3px;
      width: 20px;
      height: 20px;
      background: url(images/responsive-nav-icon.png) no-repeat;
    }
    Toon Meer
  • Php while loop

    • TheBosS
    • 21 november 2013 om 12:26

    Beste Ict scripters,

    ik heb een script geschreven dat bestaat uit een while loop die plaatjes en de benodigde gegevens uit de database haalt en weergeeft.
    Dit werkt goed, echter wil ik het nu zo maken dat op het moment dat er 5 regels weergegeven zijn met in iedere regel 5 plaatjes. dat er dan onderaan een knopje komt
    pagina 1,2 enzv. Dus om het nog even kort samen te vatten op het moment dat er meer dan 15 afbeeldingen weergegeven worden moeten de eerst volgende afbeeldingen op pagina 2 komen. Om een beter idee te geven kunt u kijken op http://www.q-cast.nl/partners.php . Daar ziet u 3 rijen met in iedere rij 5 foto's en 1 rij met 1 foto. Nu is mijn doel om de rij met 1 plaatje op de volgende pagina te krijgen. Weet iemand hoe ik dit kan doen, want ik kom er helaas niet uit. Heb geprobeerd dit script : http://www.visual-blast.com/javascript/gal…hoto-galleries/ te combineren met mijn eigen script echter werd het daar niet beter van (onkunde).

    Dit is het script dat ik nu gebruik:

    PHP
    <?php include'db_connect.php'; ?>
    				<?php	
    				$sql=mysql_query("SELECT * FROM partners ORDER BY id");
    				while($row=mysql_fetch_array($sql)){
    					
    				$link = $row['link'];
    				$naam = $row['naam'];
    				$afbeelding = $row['afbeelding'];
    				?>
              	
    				<div class="r">        	
    					<div class="g g8 node node-sidebar-reference node-promoted node-teaser">
            				<a href="<?php echo $row['link']; ?>" class="box island">    	<img src="ontwikkel_admin/images/logos/partners/<?php echo $row['afbeelding']; ?>" alt="" />
        				<span class="inset button-primary"><?php echo $row['naam']; ?></span></a></div>
    				</div>
    				<?
    				}
    				?>
    Toon Meer

    Hopelijk kan iemand mij hiermee helpen. Alvast bedankt

  • CSV importer per kolom laten importeren

    • TheBosS
    • 14 juni 2013 om 12:14

    Ik heb dit geprobeerd alleen het laat me data niet meer uit me csv bestand, ik loop vast op het importeren van de data per kolom. Ik had een CSV importer gemaakt voor 1 kolom bijvoorbeeld:
    DB
    naam- achternaam - leeftijd - email

    CSV
    kolom
    rij 1: marijn,boss,20,[email protected]
    rij 2:

    Maar ik moet nu zo maken dat alles in een eigen kolom geimporteerd kan worden. Hopelijk is mijn vraag nu duidelijker.

    Edit een printscreen van me CSV misschien dat het helpt:

    Iemand misschien enig idee wat ik verkeerd doe in het script hier boven? (het probleem is dat er geen data uitgelezen wordt in mijn 2e versie).
    Alle tips zijn welkom. In ieder geval alvast bedankt.

    Mvg

    Marijn

    PHP
    <?php 
    #gemaakt door marijn Bos//
    ?>
    	
    	<?php
    	function import()
    	{
    		 global $g_type;
    		?>  
    	   <div id="paneel">
    <?php 
    
    
    //connect to the database
    include"include/connect_voorkant.php";
    // ?>
    	<form action="" method="post" enctype="multipart/form-data" name="form1" id="form1">
      	Upload uw bestand: <br />
      	<input name="csv" type="file" id="csv" />
      	<input type="submit" name="Submit" value="Submit" />
    	</form>
    	
    	<?
    	if ($_FILES[csv][size] > 0) {
    
    
    	$csv_file = $_FILES[csv][tmp_name];
    	$csvfile = fopen($csv_file, 'r');
    	$theData = fgets($csvfile);
    	$i = 0;
    	while ($thedata = fgetcsv($csvfile,10000));
    	$csv_array = explode(",", $csv_data[$i]);
    	$insert_csv = array();
    	$insert_csv['artikelcode_leverancier'] = $csv_array[0];
    	$insert_csv['afnamegroep'] = $csv_array[1];
    	$insert_csv['leveranciersomschrijving'] = $csv_array[2];
    	$insert_csv['ingangsdatum'] = $csv_array[3];
    	$insert_csv['deeplink_productinfo'] = $csv_array[4];
    	$insert_csv['aantal_prijseenheden_per_prijs'] = $csv_array[5];
    	$insert_csv['bruto_prijs'] = $csv_array[6];
    	
    	$query = "INSERT INTO materiaal(artikelcode_leverancier, afnamegroep, leveranciersomschrijving, ingangsdatum, deeplink_productinfo, aantal_prijseenheden_per_prijs, bruto_prijs)
    	VALUES('".$insert_csv['artikelcode_leverancier']."','".$insert_csv['afnamegroep']."','".$insert_csv['leveranciersomschrijving']."','".$insert_csv['ingangsdatum']."','".$insert_csv['deeplink_productinfo']."','".$insert_csv['aantal_prijseenheden_per_prijs']."','".$insert_csv['bruto_prijs']."')";
    	$n=mysql_query($query);
    	$i++;
    	}
    	if (mysql_query($query))
      	{
      	echo "Data is upgeload";
      	}
    	else
    	{
      	echo "Error Uploaden is niet gelukt!: " . mysql_error();
    	}
    	fclose($csvfile);
    	}
    ?>
    Toon Meer
  • CSV importer per kolom laten importeren

    • TheBosS
    • 14 juni 2013 om 10:31

    Beste ICT scripters,

    Ik ben Marijn Boss 20 jaar oud en ben grafische vormgever, nu moet ik voor mijn stage bedrijf een csv importer bouwen, en dat is gelukt alleen nu is de vraag of ik hem zo kan maken dat hij per kolom een waarde invoegt. Bijvoorbeeld kolom 1= artikelcode_leverancier, Ik heb echt van alles geprobeerd maar ik kom er niet uit ik hoop dat iemand mij kan helpen? alvast bedankt!

    PHP
    <?php 
    #gemaakt door marijn Bos//
    ?>
    	
    	<?php
    	function import()
    	{
    		 global $g_type;
    		?>  
    	   <div id="paneel">
    <?php 
    
    
    //connect to the database
    include"include/connect_voorkant.php";
    //
    
    
    if ($_FILES[csv][size] > 0) {
    
    
    	//get the csv file
    	$file = $_FILES[csv][tmp_name];
    	$handle = fopen($file,"r");
    	
    	//loop through the csv file and insert into database
    	do {
        	if ($data[0]) {
            	$sql=("INSERT INTO materiaal (artikelcode_leverancier, afnamegroep, leveranciersomschrijving, ingangsdatum, deeplink_productinfo, aantal_prijseenheden_per_prijs, bruto_prijs) VALUES
    			(
                     	'".addslashes($data[0])."',
    
    
             	'".addslashes($data[1])."',
    
    
             	'".addslashes($data[2])."',
             	
    '".addslashes($data[3])."',
    
    
                        '".addslashes($data[4])."',
    
    
                        '".addslashes($data[5])."'
    
    
    '".addslashes($data[6])."'
                	)
            	");
    			mysql_query($sql);
        	}
    	} while ($data = fgetcsv($handle,10000,",","'"));
    	if (mysql_query($sql))
      {
      echo "Data is upgeload";
      }
    else
      {
      echo "Error Uploaden is niet gelukt!: " . mysql_error();
      }
    	//
    	
    	//redirect 
    	?>
       <a href="http://www.q-bouwbestek.nl/admin/admin.php?actie=import">Ga terug</a>
    <?
    }
    
    
    ?> 
    <?php if (!empty($_GET[success])) { echo "<b>Uw bestand is upgeload.</b><br><br>"; } //generic success notice ?>
    
    
    <form action="" method="post" enctype="multipart/form-data" name="form1" id="form1">
      Upload uw bestand: <br />
      <input name="csv" type="file" id="csv" />
      <input type="submit" name="Submit" value="Submit" />
    </form>
    <?
    	}
    	?>
    Toon Meer
  • PSD naar joomla 1.5

    • TheBosS
    • 4 december 2011 om 15:26

    Beste cp leden,

    Onlangs heb ik een psd ontwerp gemaakt voor mijn nieuwe website ( ben dj), en heb via internet tutorials geprobeerd dit om te zetten naar een joomla template. Dit is helaas niet helemaal gelukt joomla geeft als fout aan dat hij het bestand templateDetails.xml niet kan vinden. Terwijl dat wel in de zip zit ook ben ik bang ik nog wat fouten in mijn CSS en PHP bestanden heb zitten.

    Nu ben ik opzoek naar iemand die mij vrijwillig een x met dit project wil helpen, ja ik besef dat vrijwillig niet echt uitnodigend is en dat de meeste designers en developers wel wat beters te doen hebben maar mocht er toch iemand zijn die mij hier mee wil helpen, laat dan een bericht je achter of voeg me toe op Knip

    Met vriendelijke groet


    Marijn Boss

  • Webdeveloper voor website Event bureau

    • TheBosS
    • 17 augustus 2011 om 13:19

    Beste Cp Leden ik ben de heer Nillas in zee gegaan dus dit topic kan gesloten worden. Bedankt in iedergeval

  • Webdeveloper voor website Event bureau

    • TheBosS
    • 17 augustus 2011 om 11:42

    Beste cp leden,

    Ik zal me eigen even voorstellen.
    Mijn naam is Marijn Boss een 19 jarige event ondernemmer. Ik ben 2 jaar geleden begonnen met het ograniseren van events voor jeugd. Na een aantal leuke feesten te hebben gehad ben ik bezig met het verbeteren van mijn bedrijf. Daar kan uiteraard een verzorgde degelijke website niet aan ontbreken.

    Ik ben dus opzoek naar een website die beschikt over een mooi design en tergelijkertijd een functioneel cms.

    Als voorbeeld heb hier de site staan van riverdance festival.
    http://www.riverdancefestival.nl/

    Ik zoek geen kopie maar de opzet vindt ik wel mooi, daar komt bij dat de pagina's die hun gebruiken ik wel wil. dus home, informatie enzv.

    Verder zou ik graag in me header een jquery als deze willen hebben.

    http://www.id-t.com/

    Waar appart de feesten worden weergegeven.

    Onze feesten heten:

    - Dirty Vibes
    - Elevated Sessions
    - First Class
    - Limited Statements
    - Friends United

    Mocht je interesse hebben? voeg me dan toe op ********* en vertel je je vraag prijs en wanneer je dit kan opleveren.

    Met vriendelijke groet Marijn Boss

    EDIT R.JIPPING: geen e-mail adressen vrijgeven op het forum, contact kan via pb.

  • Jquery probleem

    • TheBosS
    • 16 maart 2011 om 10:56

    Beste cp leden, Ik ben sinds kort bezig met jquery's en heb er weinig verstand van, nu ik heb een foto gallerij die met een jquery werkt. Nu is mijn vraag of iemand mij kan vertelen of laten zien hoe ik een jquery die niet in de pagina zelf staat kan koppelen / aanroepen voor de div waar de photogallerij in staat. Bijvoorbaad bedankt voor jullie hulp.

    mijn code staat hieronder:


    Html Code


    PHP
    <div id="msg_slideshow" class="msg_slideshow">
    			<div id="msg_wrapper" class="msg_wrapper">
    				
    			<div id="msg_controls" class="msg_controls"><!-- right has to animate to 15px, default -110px -->
    				<a href="#" id="msg_grid" class="msg_grid"></a>
    				<a href="#" id="msg_prev" class="msg_prev"></a>
    				<a href="#" id="msg_pause_play" class="msg_pause"></a><!-- has to change to msg_play if paused-->
    				<a href="#" id="msg_next" class="msg_next"></a>
    			</div>
    			<div id="msg_thumbs" class="msg_thumbs"><!-- top has to animate to 0px, default -230px -->
    					<div class="msg_thumb_wrapper">
    					<a href="#"><img src="images/thumbs/1.jpg" alt="images/1.jpg"/></a>
    					<a href="#"><img src="images/thumbs/2.jpg" alt="images/2.jpg"/></a>
    					<a href="#"><img src="images/thumbs/3.jpg" alt="images/3.jpg"/></a>
    					<a href="#"><img src="images/thumbs/4.jpg" alt="images/4.jpg"/></a>
    					<a href="#"><img src="images/thumbs/5.jpg" alt="images/5.jpg"/></a>
    					<a href="#"><img src="images/thumbs/6.jpg" alt="images/6.jpg"/></a>
    					</div>
    					<div class="msg_thumb_wrapper" style="display:none;">
    					<a href="#"><img src="images/thumbs/7.jpg" alt="images/7.jpg"/></a>
    					<a href="#"><img src="images/thumbs/8.jpg" alt="images/8.jpg"/></a>
    					<a href="#"><img src="images/thumbs/9.jpg" alt="images/9.jpg"/></a>
    					<a href="#"><img src="images/thumbs/10.jpg" alt="images/10.jpg"/></a>
    					<a href="#"><img src="images/thumbs/11.jpg" alt="images/11.jpg"/></a>
    					<a href="#"><img src="images/thumbs/12.jpg" alt="images/12.jpg"/></a>
    				</div>
    				<a href="#" id="msg_thumb_next" class="msg_thumb_next"></a>
    				<a href="#" id="msg_thumb_prev" class="msg_thumb_prev"></a>
    				<a href="#" id="msg_thumb_close" class="msg_thumb_close"></a>
    				<span class="msg_loading"></span><!-- show when next thumb wrapper loading -->
    				</div>
    			</div>
    
    
    </div>
    Toon Meer


    Jquery code

    PHP
    <!-- The JavaScript -->
            <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
            <script type="text/javascript">
                $(function() {
    				/**
    				* interval : time between the display of images
    				* playtime : the timeout for the setInterval function
    				* current  : number to control the current image
    				* current_thumb : the index of the current thumbs wrapper
    				* nmb_thumb_wrappers : total number	of thumbs wrappers
    				* nmb_images_wrapper : the number of images inside of each wrapper
    				*/
    				var interval			= 4000;
    				var playtime;
    				var current 			= 0;
    				var current_thumb 		= 0;
    				var nmb_thumb_wrappers	= $('#msg_thumbs .msg_thumb_wrapper').length;
    				var nmb_images_wrapper  = 6;
    				/**
    				* start the slideshow
    				*/
    				play();
    				
    				/**
    				* show the controls when 
    				* mouseover the main container
    				*/
    				slideshowMouseEvent();
    				function slideshowMouseEvent(){
    					$('#msg_slideshow').unbind('mouseenter')
    									   .bind('mouseenter',showControls)
    									   .andSelf()
    									   .unbind('mouseleave')
    									   .bind('mouseleave',hideControls);
    					}
    				
    				/**
    				* clicking the grid icon,
    				* shows the thumbs view, pauses the slideshow, and hides the controls
    				*/
    				$('#msg_grid').bind('click',function(e){
    					hideControls();
    					$('#msg_slideshow').unbind('mouseenter').unbind('mouseleave');
    					pause();
    					$('#msg_thumbs').stop().animate({'top':'0px'},500);
    					e.preventDefault();
    				});
    				
    				/**
    				* closing the thumbs view,
    				* shows the controls
    				*/
    				$('#msg_thumb_close').bind('click',function(e){
    					showControls();
    					slideshowMouseEvent();
    					$('#msg_thumbs').stop().animate({'top':'-230px'},500);
    					e.preventDefault();
    				});
    				
    				/**
    				* pause or play icons
    				*/
    				$('#msg_pause_play').bind('click',function(e){
    					var $this = $(this);
    					if($this.hasClass('msg_play'))
    						play();
    					else
    						pause();
    					e.preventDefault();	
    				});
    				
    				/**
    				* click controls next or prev,
    				* pauses the slideshow, 
    				* and displays the next or prevoius image
    				*/
    				$('#msg_next').bind('click',function(e){
    					pause();
    					next();
    					e.preventDefault();
    				});
    				$('#msg_prev').bind('click',function(e){
    					pause();
    					prev();
    					e.preventDefault();
    				});
    				
    				/**
    				* show and hide controls functions
    				*/
    				function showControls(){
    					$('#msg_controls').stop().animate({'right':'15px'},500);
    				}
    				function hideControls(){
    					$('#msg_controls').stop().animate({'right':'-110px'},500);
    				}
    				
    				/**
    				* start the slideshow
    				*/
    				function play(){
    					next();
    					$('#msg_pause_play').addClass('msg_pause').removeClass('msg_play');
    					playtime = setInterval(next,interval)
    				}
    				
    				/**
    				* stops the slideshow
    				*/
    				function pause(){
    					$('#msg_pause_play').addClass('msg_play').removeClass('msg_pause');
    					clearTimeout(playtime);
    				}
    				
    				/**
    				* show the next image
    				*/
    				function next(){
    					++current;
    					showImage('r');
    				}
    				
    				/**
    				* shows the previous image
    				*/
    				function prev(){
    					--current;
    					showImage('l');
    				}
    				
    				/**
    				* shows an image
    				* dir : right or left
    				*/
    				function showImage(dir){
    					/**
    					* the thumbs wrapper being shown, is always 
    					* the one containing the current image
    					*/
    					alternateThumbs();
    					
    					/**
    					* the thumb that will be displayed in full mode
    					*/
    					var $thumb = $('#msg_thumbs .msg_thumb_wrapper:nth-child('+current_thumb+')')
    								.find('a:nth-child('+ parseInt(current - nmb_images_wrapper*(current_thumb -1)) +')')
    								.find('img');
    					if($thumb.length){
    						var source = $thumb.attr('alt');
    						var $currentImage = $('#msg_wrapper').find('img');
    						if($currentImage.length){
    							$currentImage.fadeOut(function(){
    								$(this).remove();
    								$('<img />').load(function(){
    									var $image = $(this);
    									resize($image);
    									$image.hide();
    									$('#msg_wrapper').empty().append($image.fadeIn());
    								}).attr('src',source);
    							});
    						}
    						else{
    							$('<img />').load(function(){
    									var $image = $(this);
    									resize($image);
    									$image.hide();
    									$('#msg_wrapper').empty().append($image.fadeIn());
    							}).attr('src',source);
    						}
    								
    					}
    					else{ //this is actually not necessary since we have a circular slideshow
    						if(dir == 'r')
    							--current;
    						else if(dir == 'l')
    							++current;	
    						alternateThumbs();
    						return;
    					}
    				}
    				
    				/**
    				* the thumbs wrapper being shown, is always 
    				* the one containing the current image
    				*/
    				function alternateThumbs(){
    					$('#msg_thumbs').find('.msg_thumb_wrapper:nth-child('+current_thumb+')')
    									.hide();
    					current_thumb = Math.ceil(current/nmb_images_wrapper);
    					/**
    					* if we reach the end, start from the beggining
    					*/
    					if(current_thumb > nmb_thumb_wrappers){
    						current_thumb 	= 1;
    						current 		= 1;
    					}	
    					/**
    					* if we are at the beggining, go to the end
    					*/					
    					else if(current_thumb == 0){
    						current_thumb 	= nmb_thumb_wrappers;
    						current 		= current_thumb*nmb_images_wrapper;
    					}
    					
    					$('#msg_thumbs').find('.msg_thumb_wrapper:nth-child('+current_thumb+')')
    									.show();	
    				}
    				
    				/**
    				* click next or previous on the thumbs wrapper
    				*/
    				$('#msg_thumb_next').bind('click',function(e){
    					next_thumb();
    					e.preventDefault();
    				});
    				$('#msg_thumb_prev').bind('click',function(e){
    					prev_thumb();
    					e.preventDefault();
    				});
    				function next_thumb(){
    					var $next_wrapper = $('#msg_thumbs').find('.msg_thumb_wrapper:nth-child('+parseInt(current_thumb+1)+')');
    					if($next_wrapper.length){
    						$('#msg_thumbs').find('.msg_thumb_wrapper:nth-child('+current_thumb+')')
    										.fadeOut(function(){
    											++current_thumb;
    											$next_wrapper.fadeIn();									
    										});
    					}
    				}
    				function prev_thumb(){
    					var $prev_wrapper = $('#msg_thumbs').find('.msg_thumb_wrapper:nth-child('+parseInt(current_thumb-1)+')');
    					if($prev_wrapper.length){
    						$('#msg_thumbs').find('.msg_thumb_wrapper:nth-child('+current_thumb+')')
    										.fadeOut(function(){
    											--current_thumb;
    											$prev_wrapper.fadeIn();									
    										});
    					}				
    				}
    				
    				/**
    				* clicking on a thumb, displays the image (alt attribute of the thumb)
    				*/
    				$('#msg_thumbs .msg_thumb_wrapper > a').bind('click',function(e){
    					var $this 		= $(this);
    					$('#msg_thumb_close').trigger('click');
    					var idx			= $this.index();
    					var p_idx		= $this.parent().index();
    					current			= parseInt(p_idx*nmb_images_wrapper + idx + 1);
    					showImage();
    					e.preventDefault();
    				}).bind('mouseenter',function(){
    					var $this 		= $(this);
    					$this.stop().animate({'opacity':1});
    				}).bind('mouseleave',function(){
    					var $this 		= $(this);	
    					$this.stop().animate({'opacity':0.5});
    				});
    				
    				/**
    				* resize the image to fit in the container (400 x 400)
    				*/
    				function resize($image){
    					var theImage 	= new Image();
    					theImage.src 	= $image.attr("src");
    					var imgwidth 	= theImage.width;
    					var imgheight 	= theImage.height;
    					
    					var containerwidth  = 400;
    					var containerheight = 400;
                    
    					if(imgwidth	> containerwidth){
    						var newwidth = containerwidth;
    						var ratio = imgwidth / containerwidth;
    						var newheight = imgheight / ratio;
    						if(newheight > containerheight){
    							var newnewheight = containerheight;
    							var newratio = newheight/containerheight;
    							var newnewwidth =newwidth/newratio;
    							theImage.width = newnewwidth;
    							theImage.height= newnewheight;
    						}
    						else{
    							theImage.width = newwidth;
    							theImage.height= newheight;
    						}
    					}
    					else if(imgheight > containerheight){
    						var newheight = containerheight;
    						var ratio = imgheight / containerheight;
    						var newwidth = imgwidth / ratio;
    						if(newwidth > containerwidth){
    							var newnewwidth = containerwidth;
    							var newratio = newwidth/containerwidth;
    							var newnewheight =newheight/newratio;
    							theImage.height = newnewheight;
    							theImage.width= newnewwidth;
    						}
    						else{
    							theImage.width = newwidth;
    							theImage.height= newheight;
    						}
    					}
    					$image.css({
    						'width'	:theImage.width,
    						'height':theImage.height
    					});
    				}
                });
            </script>
    Toon Meer
  • Scripter gezocht!

    • TheBosS
    • 15 juni 2009 om 14:47

    slotje word al geholpen. bedankt overigens voor u reactie alexruter

  • Scripter gezocht!

    • TheBosS
    • 15 juni 2009 om 14:28

    slotje

ICT Nieuws

  • Fijne feestdagen

    tcbhome 28 december 2025 om 13:55
  • Kritieke update voor Really Simple Security-plug-in

    K.Rens 16 november 2024 om 16:12
  • ING Nederland streeft naar ondersteuning van Google Pay tegen eind februari

    K.Rens 2 november 2024 om 16:09

Blogs

  • Functioneel ontwerp

    Dees 28 december 2014 om 12:38
  • Access Control List implementatie in PHP/MySQL - deel 1/2

    FangorN 28 december 2018 om 12:35
  • Access Control List implementatie in PHP/MySQL - deel 2/2

    FangorN 29 december 2018 om 12:37
  1. Marktplaats
  2. Design
  3. Voorwaarden
  4. Ons team
  5. Leden
  6. Geschiedenis
  7. Regels
  8. Links
  9. Privacy Policy
ICTscripters ©2005 - 2026 , goedkope hosting door DiMoWeb.com, BE0558.915.582
Sponsors: Beste kattenhotel provincie Antwerpen | Beste Zetes eid kaartlezer webshop
Style: Nexus by cls-design
Stylename
Nexus
Manufacturer
cls-design
Licence
Commercial styles
Help
Supportforum
Visit cls-design