onclick 2 frames vernieuwen

csshunter · 13 apr 2013

Hoi Broertjuhhh,

Ad nieuw 1
"Windows XP verliest binnenkort zijn ondersteuning" > Dat valt nogal mee (vindt een verwoed Win XP-SP3 gebruiker alhier): "Ondersteuning voor Windows XP wordt beëindigd op 8 april 2014." zegt Microsoft. En het is al zoveel keer uitgesteld, dus wie weet...

Voor een php-afteller Google men: google.nl/search?q=php+count+down
[*]Maar het lijkt me eigenlijk vroeg genoeg om op 1-1-2014 met aftellen te beginnen (of rond de kerstvakantie van 2013).

Ad nieuw 2
Eigenlijk op elke pagina!

De meta-tag voor de keywords speelt geen rol bij de Google-ranking, maar baat het niet dan schaadt het niet.
De meta-tag voor de description is wel belangrijk: dat wordt in de Google resultaten-pagina het toelichtende zinnetje dat onder de link staat (zoals hier).
De meta-tag voor de robots (zoekmachines) is ook relevant: pagina indexeren en links volgen.
Belangrijk is dat de description voor alle pagina's verschilt, en zo specifiek mogelijk is voor de pagina waar ie in staat. Dat geeft dan specifieke trefwoorden, waar de Google-zoeker op kan zoeken.

Maar minstens even belangrijk om gevonden te worden is de pagina zelf:

Geen html-errors = daar kan de Google-bot dan niet over struikelen.
Herhaling van de voor een pagina belangrijke trefwoorden: zowel in de <title> en in de meta-description als op hoofdpunten (kopregels h1, h2, subtitels, enz.) in de tekst. Hoe meer synchroon dat loopt, des te eerder zal de Google-bot denken: "Hé, dat vinden ze een belangrijk woord, daar zal de pagina waarschijnlijk wel over gaan." > met een hogere ranking voor die trefwoorden tot gevolg.
Een goede pagina-structuur met kopregels is ook behulpzaam.
In feite: een en-en beleid!

Vergelijk de pagina "Download Cleaners", zoals nu:

HTML:

<head>
    <title>Download Cleaners</title>
</head>
<body>
<p class="center">:: Cleaners ::</p>

<b>Ccleaner.</b><br>
Ccleaner verwijdert Cookies, de webbrowser geschiedenis, lijst van recent geopende bestanden, ... 
... enz.

<b>Comodo System Cleaner.</b><br>
Hoe langer je de computer gebruikt, hoe meer rotzooi zich opstapelt in je systeem. Comodo System Cleaner mest de stal uit ...
... enz.

Beter geoptimaliseerd voor zoekmachines:

HTML:

<head>
    <title>Gratis PC-cleaners: download-tips voor systeem-schoonmaak en verwijderen van malware</title>
    <meta name="description" content="Gratis PC-cleaner programma's: download-tips voor systeem-schoonmaak en verwijderen van malware." />
    <meta name="robots" content="index, follow" />
</head>
<body>
<h1 class="center">:: Download PC-Cleaners ::</h1>
<h2>Tips voor gratis PC-cleaner programma's: voor systeem-schoonmaak en verwijderen van malware.</h2>

<h3>Ccleaner</h3>
<p>Ccleaner verwijdert Cookies, de webbrowser geschiedenis, lijst van recent geopende bestanden, ... </p>
... enz.

<h3>Comodo System Cleaner</h3>
<p>Hoe langer je de computer gebruikt, hoe meer rotzooi zich opstapelt in je systeem. Comodo System Cleaner mest de stal uit ...</p>
... enz.

Zie ook de pagina Richtlijnen voor webmasters van Google.

Met vriendelijke groet,
CSShunter
_______
PS: Ik begrijp dat je de downloads als service aan de bezoeker wilt aanbieden. Maar zelf zou ik nooit een programma downloaden van een andere site dan van de makers: je weet nooit wat ze er in gestopt hebben (en dat gebeurt maar al te vaak).
Bovendien is bij de site van de makers zelf altijd de meest recente versie te vinden (met updates, patches, enz.), bij andere sites moet je dat maar afwachten (vaak lopen ze behoorlijk achter, maar dat zie je niet).
Kortom: ik denk dat de links naar de sites van de cleaners genoeg zijn, en dat je de eigen downloads best achterwege kunt laten.

=======
PS2:
Deze is ook wel aardig: De-beste-trefwoorden-voor-je-website, met vervolg in nummer #7 en uitgebreide verhandeling in #8 van dat topic.

Broertjuhhh · 24 apr 2013

Hallo csshunter,

AD nieuw 1
Aan deze kant ook een verwoed Windows XP SP3 gebruiker die hoop dat Microsoft wakker wordt.
Windows XP is tot nu toe nog steeds het beste desktop systeem (no offense to mac users ).

Zo rond de kerstdagen lijkt me een goede periode om met het aftellen te beginnen en hoppelijk kunnen we als de teller op 0 staat gewoon door gaan.

Ad nieuw 2

Bedankt voor de meta_tag tips, ik ben benieuwd hoe de resultaten zullen zijn.

PS: Daar ben ik het mee eens en ik moet nog het adres naar de betreffende site hyperlinken dan kunnen de bezoekers kiezen wat ze willen.

PS2: Goede bruikbare tip.

Broertjuhhh · 23 mei 2013

Hallo csshunter,

Voor de download wil ik een popup windowtje hebben voor een screendump van het betreffende wallpaper of programma.
In wezen eigenlijk het zelfde als met de punt in het logo “dus met css” maar ik kom er niet uit.
Het punt in dit geval is, dat het in een array verwerkt moet worden (zie script) en dan gaat het om de laatste regel.
Kan jij me helpen ?

PHP:

$array_downloads[1] = array(
'beton_grayscale_08-05-2012_1680_1050.zip',
'Beton Grayscale',
'0_wal_img/kl_beton.jpg',
'../0_img/downloadpijltje.jpg',
'<b>Beton Grayscale.</b><br>
Beton Grayscale, wallpaper - created by Fere Eadem - Opdit.nl. <br><br><br>
<br>
<b>Size : 1680 X 1050 <br>
License : Free to use <br>
Screendump : <a href="http://www.opdit.nl/download/wallpapers/0_wal_img/sd_beton.jpg" target="_blank">Beton Grayscale</a></b><hr><br>');

Broertjuhhh · 24 mei 2013

Hallo csshunter,

Het is me gelukt, hopelijk op de goede en volgende manier,
De stylesheet aangevuld met;

PHP:

a.pup
{ 
    position:relative; 
    z-index:24;
    color:#000; 
    text-decoration:none;
    cursor:hand;
    cursor:pointer;
} 
a.pup:hover {z-index:25;} 
a.pup span{display:none} 
a.pup:hover span 
{ 
    display:block; 
    position:absolute;
    top:-7em;
    left:16em;
    width:400px;
    height:250px;
    border:1px solid #000;
    box-shadow:5px 5px 20px 10px #6C6C6C;
}

Het script aangepast (de laatste regel);

PHP:

	$array_downloads[1] = array(
'beton_grayscale_08-05-2012_1680_1050.zip',
'Beton Grayscale',
'0_wal_img/kl_beton.jpg',
'../0_img/downloadpijltje.jpg',
'<b>Beton Grayscale.</b><br />
Beton Grayscale, wallpaper - created by Fere Eadem - Opdit.nl. <br /><br /><br />
<br />
<b>Size : 1680 X 1050 <br />
License : Free to use <br />
<a class="pup"><u>Screendump</u><span><img src="http://www.opdit.nl/download/wallpapers/0_wal_img/sd_beton.jpg"></span></a></b><hr><br />');

csshunter · 25 mei 2013

Hoi Broertjuhhh,
Ja, goed werk! :thumb:

Ik had iets dergelijks gefabriekt, maar nog niet ingezonden: opdit-wallpaper-nw.htm
Hoe de php hiervoor aangepast moet worden kan ik niet zeggen, want de php-code voor het neerzetten van de html heb ik niet bij de hand.
(Alleen de bovenste twee doen het, de rest is niet bewerkt in de html; het vergrootglaasje komt er bij allemaal boven te hangen. Het lijkt me n.l. het handigste voor de bezoeker om de vergroting onder de thumbnail te zetten, en de download-knop er gewoon los bij te plaatsen > ik verwacht niet zo gauw dat thumbnail de download-knop is.)

Met vriendelijke groet,
CSShunter

Broertjuhhh · 28 mei 2013

Hallo csshunter,

Ik heb er voor gekozen om voor jou manier te gaan en heb het php stukje aangepast op de volgende manier.

PHP:

	<div class="item">
		<a class="topic" href="#" onclick="return false">
			<img src="http://www.opdit.nl/download/wallpapers/0_wal_img/kl_beton.jpg" alt="" height="70" width="100">
			<img class="vgglas" src="http://www.opdit.nl/download/0_img/vergrootglas_pointer.png" alt="">
			<span>
				<img src="http://www.opdit.nl/download/wallpapers/0_wal_img/sd_beton.jpg" alt="" height="250" width="400">
			</span>
		</a>
		
		<p><strong>Beton Grayscale.</strong><br>
		Beton Grayscale, wallpaper - created by Fere Eadem - Opdit.nl.
		</p>
		
	 	<div class="clearL"></div>
		
		<a href="http://www.opdit.nl/download/wallpapers/download_wallpaper.php?download_id=1"><strong>Download</strong></a><br /><br />
		
		Size: 1680 x 1050 <br>
		Download: zip, 29 kB <br>
		File: jpg <br>
		License : Free to use

	<?php $array_downloads[1] = array(
		'beton_grayscale_08-05-2012_1680_1050.zip',
		'Beton Grayscale'); ?>
				
		<div class="clearL"></div>
	</div>
	<hr>

Nou wil ik dit script ook voor de andere download gebruiken, maar zou dan graag willen dat de tekst rechts onderaan het plaatje door gaat onder het plaatje zoals ik dat nu heb bij bijv. “Cleaners’s”.

Mijn kennis van CSS groeit maar niet zo snel als dat ik zou willen.

csshunter · 28 mei 2013

Even de .item p {margin-left: 120px} weghalen.

Dan mag de <p> de volle breedte aannemen (zodra die er is na de float-hoogte).

En dan een afstandje toevoegden aan de link voor het vergroten (wat neerkomt op een rechter-margin van het thumbnail-image):
.item a {margin-right: 20px}.

Dan komen de regels naast de thumbnail er niet stuik tegenaan.
NB: de download-link heeft nu ook 20px margin-R, maar daar heeft niemand last van.

Broertjuhhh · 30 mei 2013

Hallo csshunter,

Het is allemaal gelukt en ik ben een blij man :thumb:

Dank je wel voor alle hulp die je hebt geboden, ik had mezelf geen betere leraar kunnen wensen !

Nog 1 vraagje, ik wil iemand die “illegaal” surft terug sturen naar de start pagina index.php en heb, (welliswaar cripties) het volgende bedacht wat natuurlijk niet werkt.
Weet jij raad ?

if(empty($ipnum)) { <a href="../index.php"; } else continue

csshunter · 30 mei 2013

Voor php ben ik geen deskundige, maar als ik deze en deze combineer, kom ik uit op zoiets:

PHP:

<?php 
	$ipnum = $_SERVER['REMOTE_ADDR'];
	if(empty($users[$ipnum][0])) {
		header('Location: http://www.opdit.nl/opdit.php');
		exit;
	}
?>

Dit moet dan vóór alles helemaal bovenaan de pagina gezet worden, anders komt de foutmelding "header bestaat al".
Eventueel moet eerst de $users nog gedefinieerd worden, dat weet ik niet.

Broertjuhhh · 31 mei 2013

Hallo csshunter,

Ik heb me vergist, want $_SERVER['REMOTE_ADDR'] is nooit leeg.

Als nog bedankt !

Broertjuhhh · 31 mei 2013

Hallo csshunter,

Nog zo’n puntje op de i.

Is het mogelijk om de screendump ook langzaam in beeld te brengen (fadein) ?

Broertjuhhh · 2 jun 2013

Hallo csshunter,

We zijn weer een stukje verder, het lukt me nu, dat als je over de thumbnail hovert de screendump met fade-in effect te voorschijn komt.

Maar, als je de muis van de thumbnail weg haalt klapt de screendump zonder fade-out weg.

Hoe kan ik voor elkaar krijgen dat bij het weghalen van de muis de screendump out-fade.

Na van alles geprobeerd te hebben kom ik er niet uit en hoop dat je mij nog even kan helpen ?

PHP:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<STYLE TYPE="text/css">

.item {
	margin: 35px 0 20px 0; /* Top - Right - Bottom - Left */
	overflow: visible;
	}
.itemlast {
	min-height: 290px;
	}
.item a {
	float: left;
	margin-right: 20px;
	margin-bottom: 10px;
	}
.topic {
	position: relative;
	}
.vgglas {
	position: absolute;
	right: -3px;
	bottom: -1px;
	}
.topic span img { /* Waar die vandaan komt */
	position: absolute;
	top: 42px;
	right: 210px;
	-webkit-box-shadow: 5px 5px 20px 10px #6C6C6C;
	-moz-box-shadow: 5px 5px 20px 10px #6C6C6C;
	box-shadow: 5px 5px 20px 10px #6C6C6C; /* horizontal offset - vertical offset - blur radius - spread distance - color */
	-webkit-opacity: 0;
	-moz-opacity: 0;
	opacity: 0;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-ms-transition: all 1s ease;
	-o-transition: all 1s ease;
	transition: all 1s ease;
	}
.topic:hover span img { /* Waar die heen gaat */
	position: absolute;
	top: 42px;
	left: 174px;
	-webkit-opacity: 1;
	-moz-opacity: 1;
	opacity: 1;
	}
.item p {
	margin-top: 0;
	}
.clearL {
	clear: left;
	}

</STYLE>

</head>

<body>

	
<div class="item"> <a class="topic" href="#" onclick="return false"><img src="file:///E|/00%20-%20Websites/opdit_csh/x_test/kl_bluebeam.jpg" alt="" height="70" width="100"> 
  <img class="vgglas" src="file:///E|/00%20-%20Websites/opdit_csh/x_test/vergrootglas_pointer.png" alt=""> 
  <span><img src="file:///E|/00%20-%20Websites/opdit_csh/x_test/sd_bluebeam.jpg" alt="" height="250" width="400"></span></a> 
  <p><strong>Beton Grayscale.</strong><br>
		Wallpaper :: created by Fere Eadem :: Opdit.nl.
		</p>
	  
		<div class="clearL"></div>
		
		<a href="file:///E|/00%20-%20Websites/opdit_csh/x_test/fade_in.htm.php?download_id=1"><strong>Download</strong></a><br /><br />
		
		Size : 1680 x 1050 <br>
		Download : zip, 29 kB <br>
		File : jpg <br>
		License : Free to use 
	
	<?php $array_downloads[1] = array(
		'beton_grayscale_08-05-2012_1680_1050.zip',
		'Beton Grayscale'); ?>
		
		<div class="clearL"></div>
	</div>
	<hr>

</body>
</html>

csshunter · 6 jun 2013

Beetje andere html-structuur, beetje andere bijpassende css, en home-made fadeIn/fadeOut-scriptje i.p.v. de css3-transitions:

Et voilà: opdit-wallpaper-fade.htm
Geen problemen met oudere IE's (IE7 doet het ook). - De html-errors zitten er nog in.
(Als javascript uit staat, doet hij het dus niet - en dan is ook het vergrootglaasje niet zichtbaar; maar surfers met disabled javascript zijn erg dun gezaaid -ca. 2%- en dat zijn met name de surfers die met een pure tekst-browser werken en toch geen images kunnen zien.)
Zie broncode!

Broertjuhhh · 7 jun 2013

Hallo csshunter,

Bedankt voor je inspanning :thumb:

Is het niet mogelijk met alleen CSS net zo als de fade_in ?
Als het niet mogelijk is met CSS , waarom is dat dan zo ?

Javascript wil ik als het even kan zo min mogelijk gebruiken.

csshunter · 7 jun 2013

Met de css3-transitions heb ik weinig ervaring - misschien kan het ook rechtstreeks met css3 voor de terugweg, maar volgens deze bron zou er jQuery (= javascript) aan te pas moeten komen om een fadeOut te bewerkstelligen.

Maar in elk geval is er het probleem van de browsers (zie hier voor de support van de css3-transitions): IE9, IE8 en IE7 doen het zonder meer niet op deze manier.

Nu kan dat ook wel weer opgelost worden door er bv. modernizer op los te laten, maar modernizer is ... een javascript-bibliotheek!

Conclusie: als je ook Internet Explorer-bezoekers wilt laten genieten van het in- en uitfaden, kan het niet zonder javascript.
Daarom geef ik er de voorkeur aan om een klein handgemaakt scriptje toe te voegen in plaats van een hele bieb.
Dat is dus: zo min mogelijk javascript.

Broertjuhhh · 15 jun 2013

Hallo csshunter,

Alle grote browsers doen het acceptabel, dus ik laat het er hier even bij.

Bedank je nogmaals voor de fantastische hulp, ik heb een hoop geleerd ! :thumb:

Sluit bij deze, gelijk deze post als zijnde opgelost, want dat is die met vlag en wimpel !

onclick 2 frames vernieuwen

csshunter

Meubilair

Broertjuhhh

Gebruiker

Broertjuhhh

Gebruiker

Broertjuhhh

Gebruiker

csshunter

Meubilair

Broertjuhhh

Gebruiker

csshunter

Meubilair

Broertjuhhh

Gebruiker

csshunter

Meubilair

Broertjuhhh

Gebruiker

Broertjuhhh

Gebruiker

Broertjuhhh

Gebruiker

csshunter

Meubilair

Broertjuhhh

Gebruiker

csshunter

Meubilair

Broertjuhhh

Gebruiker

Nieuwste berichten

Wij waarderen jouw privacy