Thread: HTML Vraagje
-
14-06-2010, 18:43 #1Member
- Registered
- 03/06/06
- Posts
- 510
- iTrader
- 0
- Mentioned
- 0 Post(s)
HTML Vraagje
Ik zit hier nu al even te prutsen, maar het lijkt me niet te lukken en daarom zet ik het hier:
Ik heb volgend javascript gebruikt om een bannersysteem op een forum te hebben:
Vervolgens heb ik mijn headerafbeelding op mijn forum als background in een div geplaatst en hierop dan het javascript laten verschijnenen, ziet er als volgt uit:<SCRIPT LANGUAGE="JavaScript">
<!-- Beginning of JavaScript -
if (document.images) {
ads = new Array(3);
ads[0] = "http://www.iendracht.be/images/banners/vandenborrebert.gif";
ads[1] = "http://www.iendracht.be/images/banners/lasfiestasbewegend.gif";
ads[2] = "http://www.iendracht.be/images/banners/vandenborrebert.gif";
}
newplace = new Array(3);
newplace[0] = "http://www.iendracht.be"
newplace[1] = "http://www.lasfiestas.be"
newplace[2] = "http://www.iendracht.be"
var timer = null
var counter = 0
function banner() {
timer=setTimeout("banner()", 36000);
counter++;
if (counter >= 3)
counter = 0;
document.bannerad.src = ads[counter];
}
function gothere() {
counter2 = counter;
window.location.href = newplace[counter2];
}
// - End of JavaScript - -->
</SCRIPT>
Dit is het (beoogde) resultaat:<div align="right" style="background-image: url(http://www.iendracht.be/forum/styles...ite_logo.jpg); height: 110px; width: 956px; "><a href="javascript:gothere()"><IMG SRC="http://www.iendracht.be/images/banners/lasfiestasbewegend.gif" NAME="bannerad" WIDTH="280" HEIGHT="60" BORDER="0"></a></div>
Iendracht.be - Forum Eendracht Aalst -
Nu is de vraag:
Hoe krijg ik die banners enkele pixels meer naar beneden en naar echts, zodat ze niet zo tegen de rand plakken ?
Dank op voorhand
no votes
-
-
14-06-2010, 18:56 #2
margin-right & margin-top

maar normaal splits je layout & code op. Voor lay-out steek je alles in een css(cascading style sheet) bestandno votes
-
14-06-2010, 19:19 #3no votes
-
14-06-2010, 20:57 #4Maar half en half getest dus niet 100% zeker.Code:
<div style="background-image: url("http://www.iendracht.be/forum/styles/serenity/theme/images/site_logo.jpg"); height: 110px; width: 956px; position: relative;"> <a href="javascript:gothere()" style="position: absolute; right: 10px; top: 10px; display: block;"> <img src="http://www.iendracht.be/images/banners/forum/vandenborreforum.gif"> </a> </div>no votes
-
16-06-2010, 02:16 #5Member
- Registered
- 03/06/06
- Posts
- 510
- iTrader
- 0
- Mentioned
- 0 Post(s)
Bedankt ! Zoals je kan zien lijkt dat wel te werken... Is die code deftig nu ? Want met een forum dat veel vernieuwd wordt is dat wel redelijk belangrijk neem ik aan ?
Nog een vraagje: hoe kan ik dat javascript aanpassen zodat de eerste afbeelding die verschijnt random gekozen wordt ?no votes
-
16-06-2010, 10:08 #6
JavaScript random() Method
alle foto's in nen array, en dan random een nummerke daaruit nemen.no votes
-
21-06-2010, 16:33 #7Member
- Registered
- 03/06/06
- Posts
- 510
- iTrader
- 0
- Mentioned
- 0 Post(s)
Probleem: bij sommigen worden de banners overeen weergeven...
Zie screenshot:
Imageshack - pic32757.jpgno votes
-
28-07-2010, 22:48 #8Member
- Registered
- 03/06/06
- Posts
- 510
- iTrader
- 0
- Mentioned
- 0 Post(s)
Niemand die weet hoe dit komt ? Ik heb het nog nooit gehad maar bij sommigen is het dus wel zo ...
Verder werden er steeds 3 banners weergegeven, maar nu moeten dat er dus drie zijn. Ik dacht dat ik alles correct had aangepast in het javascript, maar hij blijft er maar drie weergeven, wat doe ik verkeerd ?
<head>
<!-- INCLUDE ca_config.html -->
<meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" />
<meta http-equiv="content-language" content="{S_USER_LANG}" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="resource-type" content="document" />
<meta name="distribution" content="global" />
<meta name="copyright" content="2005-2009 Iendracht.be" />
<meta name="description" content="Supportersforum van Eendracht Aalst - Discussieer mee op Iendracht.be !" />
<meta name="keywords" content="forum, eendracht, aalst, iendracht, supporters, sfeer, voetbal, oilsjt, ajuinen, football, soccer, belgium, opc, carnaval, ambiance, foto, video, wedstrijden, speler, interviews" />
<meta name="robots" content="index, follow" />
<meta name="revisit-after" content="1 days" />
<!-- Forum, Eendracht, Aalst --><cmt>
<link rel="shortcut icon" href="http://www.iendracht.be/images/favicon.ico" />
<title>{SITENAME} - <!-- IF S_IN_MCP -->{L_MCP} - <!-- ELSEIF S_IN_UCP -->{L_UCP} - <!-- ENDIF -->{TOPIC_TITLE}</title>
<link rel="stylesheet" href="{T_STYLESHEET_LINK}" type="text/css" />
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="{T_THEME_PATH}/ie7.css" />
<![endif]-->
<script type="text/javascript">
// <![CDATA[
function popup(url, width, height, name)
{
if (!name)
{
name = '_popup';
}
window.open(url.replace(/&/g, '&'), name, 'height=' + height + ',resizable=yes,scrollbars=yes,width=' + width);
return false;
}
function jumpto()
{
var page = prompt('{LA_JUMP_PAGE}:', '{ON_PAGE}');
var perpage = '{PER_PAGE}';
var base_url = '{A_BASE_URL}';
if (page !== null && !isNaN(page) && page > 0)
{
document.location.href = base_url.replace(/&/g, '&') + '&start=' + ((page - 1) * perpage);
}
}
/**
* Find a member
*/
function find_username(url)
{
popup(url, 760, 570, '_usersearch');
return false;
}
/**
* Mark/unmark checklist
* id = ID of parent container, name = name prefix, state = state [true/false]
*/
function marklist(id, name, state)
{
var parent = document.getElementById(id);
if (!parent)
{
eval('parent = document.' + id);
}
if (!parent)
{
return;
}
var rb = parent.getElementsByTagName('input');
for (var r = 0; r < rb.length; r++)
{
if (rb[r].name.substr(0, name.length) == name)
{
rb[r].checked = state;
}
}
}
<!-- IF ._file -->
/**
* Play quicktime file by determining it's width/height
* from the displayed rectangle area
*
* Only defined if there is a file block present.
*/
function play_qt_file(obj)
{
var rectangle = obj.GetRectangle();
if (rectangle)
{
rectangle = rectangle.split(',')
var x1 = parseInt(rectangle[0]);
var x2 = parseInt(rectangle[2]);
var y1 = parseInt(rectangle[1]);
var y2 = parseInt(rectangle[3]);
var width = (x1 < 0) ? (x1 * -1) + x2 : x2 - x1;
var height = (y1 < 0) ? (y1 * -1) + y2 : y2 - y1;
}
else
{
var width = 200;
var height = 0;
}
obj.width = width;
obj.height = height + 16;
obj.SetControllerVisible(true);
obj.Play();
}
<!-- ENDIF -->
if(navigator.userAgent && navigator.userAgent.indexOf('Mac OS X') > 0)
{
document.write('<link rel="stylesheet" href="{T_THEME_PATH}/mac.css" type="text/css" />');
}
// ]]>
</script>
<SCRIPT LANGUAGE="JavaScript">
<!-- Beginning of JavaScript -
if (document.images) {
ads = new Array(4);
ads[0] = "http://www.iendracht.be/images/banners/forum/vandenborreforum.gif";
ads[1] = "http://www.iendracht.be/images/banners/forum/lasfiestasforum.gif";
ads[2] = "http://www.iendracht.be/images/banners/forum/becycleforum.gif";
ads[3] = "http://www.iendracht.be/images/banners/laptopshop_banner_280x60.gif";
}
newplace = new Array(4);
newplace[0] = "http://www.iendracht.be/component/content/article/42-vaste-paginas/676-van-den-borre-bert"
newplace[1] = "http://www.lasfiestas.be"
newplace[2] = "http://www.be-cycle.com"
newplace[3] = "http://laptop-shop.be/"
var timer = null
var counter = 0
function banner() {
timer=setTimeout("banner()", 4500);
counter++;
if (counter >= 4)
counter = 0;
document.bannerad.src = ads[counter];
}
function gothere() {
counter2 = counter;
window.location.href = newplace[counter2];
}
// - End of JavaScript - -->
</SCRIPT>
</head>
<BODY onload="banner()">
<table border="0" cellspacing="0" cellpadding="0" width="{$CA_WIDTH}" id="maintable" align="center">
<tr>
<td id="logorow" align="center">
<div style="background-image: url(http://www.iendracht.be/forum/styles...ite_logo.jpg); height: 110px; width: 956px; position: relative; border: 1px solid black;">
<a href="javascript:gothere()" style="position: absolute; right: 10px; top: 10px;"><IMG SRC="http://www.iendracht.be/images/banners/forum/vandenborreforum.gif" WIDTH="280" HEIGHT="60" BORDER="0" NAME="bannerad"></a>
</div>
</td>
<tr>
<td class="navtd">
<div class="navrow">
<div class="navrow-right">
<a href="{U_FAQ}">{L_FAQ}</a>
<!-- IF U_RESTORE_PERMISSIONS --> • <a href="{U_RESTORE_PERMISSIONS}">{L_RESTORE_PERMISSI ONS}</a><!-- ENDIF -->
<!-- IF S_DISPLAY_SEARCH --> • <a href="{U_SEARCH}">{L_SEARCH}</a><!-- ENDIF -->
<!-- IF not S_IS_BOT -->
<!-- IF S_DISPLAY_MEMBERLIST --> • <a href="{U_MEMBERLIST}">{L_MEMBERLIST}</a><!-- ENDIF -->
<!-- ENDIF -->
<!-- IF not S_IS_BOT --> • <a href="{U_LOGIN_LOGOUT}">{L_LOGIN_LOGOUT}</a><!-- ENDIF -->
</div>
<!-- IF not S_IS_BOT -->
<!-- IF S_USER_LOGGED_IN --><a href="{U_PROFILE}">{L_PROFILE}</a><!-- ENDIF -->
<!-- IF S_USER_LOGGED_IN -->
<!-- IF S_DISPLAY_PM --> • <a href="{U_PRIVATEMSGS}">{PRIVATE_MESSAGE_INFO}</a><!-- ENDIF -->
<!-- ELSEIF S_REGISTER_ENABLED --><a href="{U_REGISTER}">{L_REGISTER}</a><!-- ENDIF -->
• <b> <a href="http://www.iendracht.be"> Ga naar de website</a></b>
• <b> <a href="http://www.iendracht.be/index.php/iendrachtbe/contacteer-ons"> Contacteer ons</a></b>
<!-- ENDIF -->
</div>
<div class="navrow2"><b><div class="navrow-right">
{CURRENT_TIME}
</div>
<a href="{U_INDEX}">{L_INDEX}</a><!-- BEGIN navlinks --> » <a href="{navlinks.U_VIEW_FORUM}">{navlinks.FORUM_NAM E}</a><!-- END navlinks -->
</div>
</td>
</tr>
<tr>
<td id="contentrow">
<!-- IF not S_IS_BOT && not $CA_SKIP_PM_NOTIFY && S_USER_LOGGED_IN && S_DISPLAY_PM -->
<!-- IF S_USER_NEW_PRIVMSG -->
<div class="pm-notify-new"><div class="pm-notify-header">{L_PRIVATE_MESSAGES}</div><a href="{U_PRIVATEMSGS}">{PRIVATE_MESSAGE_INFO}<!-- IF PRIVATE_MESSAGE_INFO_UNREAD -->, {PRIVATE_MESSAGE_INFO_UNREAD}<!-- ENDIF --></a></div>
<!-- ELSEIF S_USER_UNREAD_PRIVMSG -->
<div class="pm-notify-unread"><div class="pm-notify-header">{L_PRIVATE_MESSAGES}</div><a href="{U_PRIVATEMSGS}">{PRIVATE_MESSAGE_INFO}<!-- IF PRIVATE_MESSAGE_INFO_UNREAD -->, {PRIVATE_MESSAGE_INFO_UNREAD}<!-- ENDIF --></a></div>
<!-- ENDIF -->
<!-- ENDIF -->
<!-- IF S_BOARD_DISABLED and S_USER_LOGGED_IN and (U_MCP or U_ACP) -->
<div class="pm-notify-new"><div class="pm-notify-header">{L_INFORMATION}</div>{L_BOARD_DISABLED}</div>
<!-- ENDIF -->
<center><!-- INCLUDE announcement_centre.html --></center>
<!-- IF S_DISPLAY_SEARCH -->
<p class="searchbar">
<span style="float: {S_CONTENT_FLOW_BEGIN};"><a href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED} </a> | <a href="{U_SEARCH_ACTIVE_TOPICS}">{L_SEARCH_ACTIVE_T OPICS}</a></span>
<!-- IF S_USER_LOGGED_IN -->
<span style="float: {S_CONTENT_FLOW_END};"><a href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a> | <a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a></span>
<!-- ENDIF -->
</p>
<!-- ENDIF -->
<br style="clear: both;" />
</body>no votes
-
29-07-2010, 12:53 #9Approved 9-lifer
- Registered
- 03/12/03
- Location
- Oostende
- Posts
- 2,599
- iTrader
- 78 (100%)
- Mentioned
- 0 Post(s)
- Reputation
- 7/10
ik denk, heb het maar snel bekeken.
hier
doe je uw counter + 1 nog voor je de eerste getoond hebtCode:var timer = null var counter = 0 function banner() { timer=setTimeout("banner()", 4500); counter++; if (counter >= 4) counter = 0; document.bannerad.src = ads[counter]; }
zal dus wss moeten uw counter opt einde zetten en niet int begin. van uw "loop"
probeer da eensCode:function banner() { timer=setTimeout("banner()", 4500); if (counter >= 4) counter = 0; document.bannerad.src = ads[counter]; counter++; }no votes
-
02-08-2010, 18:49 #10Member
- Registered
- 03/06/06
- Posts
- 510
- iTrader
- 0
- Mentioned
- 0 Post(s)
Dat lost het inderdaad op.
Wat ik nu wel heb is dat er een willekeurige link wordt toegewezen aan een afbeelding. En dat is uiteraard niet de bedoeling: Afbeelding 1 moet naar Link 1 gaan enzoverder...
Dit was vroeger wel niet, maar ik zie niet in wat er nu verandert is ? Als ik op de vierde klik is er een soort van javascript error, er komt dan in de link op "undefined"
Iemand een idee ? :-)no votes
-
02-08-2010, 18:55 #11Member
- Registered
- 03/06/06
- Posts
- 510
- iTrader
- 0
- Mentioned
- 0 Post(s)
De links zijn niet willekeurig:
Afbeelding 0 geeft Link 1 weer
Afbeelding 1 geeft Link 2 weer
Afbeelding 2 geeft Link 3 weer
Afbeelding 3 is "Undefined"no votes
-
02-08-2010, 19:49 #12
undefined wilt zeggen dat er niks gevonden wordt of dat ge bvb een index in een array aanspreekt die geen waarde bevat.. Maar voor de rest kan ik echt niet volgen ze :
Eerst dit :
Dan dit :
eh?
Ik dacht trouwens ook dat ge met 3 afbeeldingen werkte ipv 4?
Arrays en hun indexen zijn zero based he
Dus als ge ' new Array(3) ' doet , is het derde element in uw array gelijk aan het element in uw array met index 2.
Die afbeeldingen 3 zou daar dus volgens mij gewoon niet mogen komen en heeft te maken met dat ge wss ergens een checkske doet als in ' <= ' terwijl het '<' moet zijn, oftewel uw maximum waarden verlagen met 1
max = ( count( array ) - 1 )
Als ge uw link array dan respectievelijk opbouwt met uw ads array dan kunt ge dezelfste counter var gebruiken voor uw indexCode:var counter = 0; setTimeout("banner()", 4500); function banner() { if (counter == 3) counter = 0; document.bannerad.src = ads[counter]; // hier uw link dan nog juist zetten counter++; setTimeout("banner()", 4500); }Last edited by adrianhates; 02-08-2010 at 20:00.
no votes
-
02-08-2010, 21:15 #13Member
- Registered
- 03/06/06
- Posts
- 510
- iTrader
- 0
- Mentioned
- 0 Post(s)
Het script was inderdaad oorspronkelijk bedoeld voor 3 banners en ik heb daar wat aan geprutst om zo 4 banners weer te geven. Maar blijkbaar niet goed genoeg, want de links zijn niet willekeurig (verkeerd gezegd in eerste topic) maar ze gaan dus eentje verder.
Nu is mijn Javascript kennis te beperkt hiervoor, maar wat zou jij dan aanpassen in onderstaande code om die script deftig te krijgen voor 4 banners (en bv. 5 banners als dat later nodig zou zijn ?)
HTML Code:<SCRIPT LANGUAGE="JavaScript"> <!-- Beginning of JavaScript - if (document.images) { ads = new Array(4); ads[0] = "http://www.iendracht.be/images/banners/laptopshop_banner_280x60.gif"; ads[1] = "http://www.iendracht.be/images/banners/forum/lasfiestasforum.gif"; ads[2] = "http://www.iendracht.be/images/banners/forum/becycleforum.gif"; ads[3] = "http://www.iendracht.be/images/banners/forum/vandenborreforum.gif"; } newplace = new Array(4); newplace[0] = "http://www.iendracht.be/forum" newplace[1] = "http://www.laptop-shop.be/" newplace[2] = "http://www.lasfiestas.be" newplace[3] = "http://www.be-cycle.com" var timer = null var counter = 0 function banner() { timer=setTimeout("banner()", 4500); if (counter >= 5) counter = 0; document.bannerad.src = ads[counter]; counter++; } function gothere() { counter2 = counter; window.location.href = newplace[counter2]; } // - End of JavaScript - --> </SCRIPT>
no votes
-
03-08-2010, 00:55 #14Niet getest maar ik denk wel da da moet werken..HTML Code:
<SCRIPT LANGUAGE="JavaScript"> <!-- Beginning of JavaScript - if (document.images) { ads = new Array(4); ads[0] = "http://www.iendracht.be/images/banners/laptopshop_banner_280x60.gif"; ads[1] = "http://www.iendracht.be/images/banners/forum/lasfiestasforum.gif"; ads[2] = "http://www.iendracht.be/images/banners/forum/becycleforum.gif"; ads[3] = "http://www.iendracht.be/images/banners/forum/vandenborreforum.gif"; } newplace = new Array(4); newplace[0] = "http://www.iendracht.be/forum" newplace[1] = "http://www.laptop-shop.be/" newplace[2] = "http://www.lasfiestas.be" newplace[3] = "http://www.be-cycle.com" var counter = 0; // banner oproepen na 4500 ms setTimeout("banner()", 4500); function banner() { if (counter == 4) counter = 0; document.bannerad.src = ads[counter]; counter++; setTimeout("banner()", 4500); } function gothere() { window.location = newplace[counter]; } // - End of JavaScript - --> </SCRIPT>
no votes
Sylvie de caluwé
