スクリプト作成メモとして、通常プルダウンでは ul,li 構造にて作成するが ppBBS3 では他にも構造上多用されている。
他からの干渉を防ぐため Table 構造で作成する。
stylemenu.js
document.write('<div id="SUB" style="position:absolute;border:2px solid #888;z-index:50;display:none;" onclick="OffPop(\'SUB\')">');
document.write('<table cellspacing="4" cellpadding="4" style="background-color:#363636">');
document.write('<tr style="background-color:#464646;">');
document.write('<th onmouseover="this.style.backgroundColor=\'#000\'" onmouseout="this.style.backgroundColor=\'\'" width="110">');
document.write('<a href="./index.php?style=1">Prosilver</a>');
document.write('</th></tr>');
document.write('<tr style="background-color:#464646;">');
document.write('<th onmouseover="this.style.backgroundColor=\'#000\'" onmouseout="this.style.backgroundColor=\'\'" width="110">');
document.write('<a href="./index.php?style=7">Blue_Turtle</a>');
document.write('</th></tr>');
document.write('<tr style="background-color:#464646;">');
document.write('<th onmouseover="this.style.backgroundColor=\'#000\'" onmouseout="this.style.backgroundColor=\'\'" width="110">');
document.write('<a href="./index.php?style=5">Special Edition</a>');
document.write('</th></tr>');
document.write('</table>');
document.write('</div>');
参考として ul,li を用いた例
document.write('<div id="SUB" style="position:absolute;border:2px solid #888;z-index:50;display:none;" onclick="OffPop(\'SUB\')">');
document.write('<ul style="background-color:#363636">');
document.write('<li style="background-color:#464646;margin:2px 2px 2px 2px;" onmouseover="this.style.backgroundColor=\'#000\'" onmouseout="this.style.backgroundColor=\'\'">');
document.write('<a href="./index.php?style=2&lang=ja&sd=1">Black Pearl</a>');
document.write('</li>');
document.write('<li style="background-color:#464646;margin:2px 2px 2px 2px;" onmouseover="this.style.backgroundColor=\'#000\'" onmouseout="this.style.backgroundColor=\'\'">');
document.write('<a href="./index.php?style=3&lang=ja&sd=1">Charcoal</a>');
document.write('</li>');
document.write('<li style="background-color:#464646;margin:2px 2px 2px 2px;" onmouseover="this.style.backgroundColor=\'#000\'" onmouseout="this.style.backgroundColor=\'\'">');
document.write('<a href="./index.php?style=10&lang=ja&sd=1">freestyler</a>');
document.write('</li>');
document.write('</ul>');
document.write('</div>');
stylepopup.js
var strUA = navigator.userAgent.toLowerCase();
var eventX = 0;
var eventY = 0;
function OnPop(Msg,eventX,eventY){
MyMsg = document.getElementById(Msg).style;
eventX = eventX + 40; MyMsg.left = eventX + 'px';
eventY = eventY + 20; MyMsg.top = eventY + 'px';
if (MyMsg) MyMsg.display == 'none' ? MyMsg.display = '' : MyMsg.display = 'none';
if (MyMsgB != MyMsg) MyMsgB.display = 'none';
MyMsgB = MyMsg;
}
function OffPop(Msg){
document.getElementById(Msg).style.display = 'none';
}