您的位置:首页 > 运维架构 > Linux

Linux入侵监测系统LIDS原理

2014-02-06 09:25 344 查看
photostepcarousel.jsp

<%@ page contentType="text/html; charset=UTF-8" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<base href="http://localhost:8080/dojodemo/" />
<title>图片滑动</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body,html { margin:0; padding:0; color:#333333; font-size:12px; line-height:20px; background-color:#FFFFFF;}
ul,li { list-style:none; margin:0; padding:0;}
img { border:none;margin:0;padding:0px;}
a { color:#333333; text-decoration:none;}
a:hover { color:#FC5A0A; text-decoration:none;}
.box_title {color:#590000; line-height:17px; text-align:left; font-weight:bold; font-size:14px;background:url(http://static.l99.com/skin/default/images/bg_title_1.jpg) left top repeat-x;padding:1px 0px 0px 3px;}
.box_line { height:26px; background:url(http://static.l99.com/skin/default/images/line_title_1.jpg) left bottom repeat-x; padding:1px 1px 0px 1px;}
.box_border {width:100%; border:solid 1px #999999; margin-bottom:15px; padding-bottom:4px; overflow:hidden; background: url(http://static.l99.com/skin/default/images/picture/bg_corner.jpg) right bottom no-repeat;}
.photo_select {border:1px #fc5a0a solid;  opacity:0.61; filter:Alpha(Opacity=61);}
.stepcarousel{position: relative;width: 720px;height: 120px;}
.stepcarousel .belt{position: absolute;left: 0;top: 0;}
.prev {display:block;width:20px;height:20px;background: url(http://static.l99.com/skin/default/images/arrow.gif) 0 0 no-repeat;position:absolute;left:0;bottom:0;}
.prev:hover{background: url(http://static.l99.com/skin/default/images/arrow.gif) 0 -20px no-repeat;}
.next {display:block;width:20px;height:20px;background: url(http://static.l99.com/skin/default/images/arrow.gif) -20px 0px no-repeat;position:absolute;right:0;bottom:0;}
.next:hover {background: url(http://static.l99.com/skin/default/images/arrow.gif) -20px -20px no-repeat;}
.adv_view ul { width:720px; margin: 0px auto;}
.adv_view ul li{ float: left; width: 110px; height:104px; margin: 10px; display:inline;text-align:center; vertical-align:middle; *font-size: 88px;}
.adv_view ul li img {margin:0 auto;vertical-align:middle;}
</style>
</head>

<body>
<div style="width: 730px; position: relative;left: 20%;top: 100px;">
<div class="box_border adv_view" style="position: relative;">
<div class="box_line">
<div class="box_title">图片滑动</div>
</div>
<div class="stepcarousel" id="mygallery">
<div class="belt">
<ul id="hot_picture1" class="hot_picture">
<li class="styleSingleHotPic photo_select" style="float: none; position: absolute; left: 0px;">
<a href="javascript:void(0);">
<img src="photos/jquery/1221229158335_yezi47_s.jpg" />
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 122px;">
<a href="javascript:void(0);">
<img src="photos/jquery/1218838819597_8gh87i_s.jpg" />
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 242px;">
<a href="javascript:void(0);">
<img src="photos/jquery/1219761385362_5mq0kv_s.jpg" />
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 362px;">
<a href="javascript:void(0);">
<img src="photos/jquery/1219762971646_8r2c1h_s.jpg" />
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 482px;">
<a href="javascript:void(0);">
<img src="photos/jquery/1219716241365_w31br2_s.jpg" />
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 602px;">
<a href="javascript:void(0);">
<img src="photos/jquery/1219761443515_3p0m95_s.jpg"/>
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 722px;">
<a href="javascript:void(0);">
<img src="photos/jquery/1219240181821_1xrmt9_s.jpeg"/>
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 842px;">
<a href="javascript:void(0);">
<img src="photos/jquery/1218910221184_m31atb_s.jpg"/>
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 962px;">
<a href="javascript:void(0);">
<img src="photos/jquery/1218977244296_nk198x_s.jpg"/>
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 1082px;">
<a href="javascript:void(0);">
<img src="photos/jquery/1219716224546_g0pd8n_s.jpg"/>
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 1202px;">
<a href="javascript:void(0);">
<img  src="photos/jquery/1221228985007_6fma7t_s.jpg"/>
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 1322px;">
<a href="javascript:void(0);">
<img  src="photos/jquery/1219716244624_2nr6ce_s.jpg"/>
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 1442px;">
<a href="javascript:void(0);">
<img  src="photos/jquery/1219716229627_ksc3g3_s.jpg"/>
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 1562px;">
<a href="javascript:void(0);">
<img  src="photos/jquery/1219762966900_ug829i_s.jpg"/>
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 1682px;">
<a href="javascript:void(0);">
<img  src="photos/jquery/1219464163301_tg9hk9_s.jpg"/>
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 1802px;">
<a href="javascript:void(0);">
<img src="photos/jquery/1219716357617_9pti45_s.jpg"/>
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 1922px;">
<a href="javascript:void(0);">
<img src="photos/jquery/1219240207051_7aek7x_s.jpg"/>
</a>
</li>

<li class="styleSingleHotPic" style="float: none; position: absolute; left: 2162px;">
<a href="javascript:void(0);">
<img src="photos/jquery/1218838758341_amia76_s.jpg"/>
</a>
</li>

</ul>
</div>
</div>
<a class="prev" href="javascript:stepcarousel.stepBy('mygallery', -6);" title="上一组">  </a>
<a class="next" href="javascript:stepcarousel.stepBy('mygallery', 6);" title="下一组">  </a>
</div>
<b>当前数:</b> <span id="statusA"></span> <b style="margin-left: 30px">总数:</b> <span id="statusC"></span> <br /><br />
</div>
<script type="text/javascript" src="js/jquery-1.2.6.pack.js"></script>
<script type="text/javascript" src="js/photo.stepcarousel.js"></script>

<script type="text/javascript" >
stepcarousel.setup({
galleryid: 'mygallery',
beltclass: 'belt',
panelclass: 'styleSingleHotPic',
panelbehavior: {speed:500, wraparound:true, persist:true},
defaultbuttons: {enable: true, moveby: 1, leftnav: ['http://i34.tinypic.com/317e0s5.gif', 1, 75], rightnav: ['http://i38.tinypic.com/33o7di8.gif', -14, 75]},
statusvars: ['statusA', 'statusB', 'statusC'],
contenttype: ['inline']
});
</script>
</body>
</html>

 
 
 

 

photo.stepcarousel.js

var stepcarousel={

ajaxloadingmsg: '<div style="margin: 1em; font-weight: bold"><img src="http://static.l99.com/skin/default/images/picture/lightbox-ico-loading.gif" style="vertical-align: middle" /> Fetching Content. Please wait...</div>', //customize HTML to show while fetching Ajax content

defaultbuttonsfade: 0.4, //Fade degree for disabled nav buttons (0=completely transparent, 1=completely opaque)

configholder: {},

getCSSValue:function(val){ //Returns either 0 (if val contains 'auto') or val as an integer

return (val=="auto")? 0 : parseInt(val);

},

getremotepanels:function($, config){ //function to fetch external page containing the panel DIVs

config.$belt.html(this.ajaxloadingmsg);

$.ajax({

url: config.contenttype[1], //path to external content

async: true,

error:function(ajaxrequest){

config.$belt.html('Error fetching content.<br />Server Response: '+ajaxrequest.responseText);

},

success:function(content){

config.$belt.html(content);

config.$panels=config.$gallery.find('.'+config.panelclass);

stepcarousel.alignpanels($, config);

}

})

},

getoffset:function(what, offsettype){

return (what.offsetParent)? what[offsettype]+this.getoffset(what.offsetParent, offsettype) : what[offsettype];

},

getCookie:function(Name){

var re=new RegExp(Name+"=[^;]+", "i"); //construct RE to search for target name/value pair

if (document.cookie.match(re)) //if cookie found

return document.cookie.match(re)[0].split("=")[1]; //return its value

return null;

},

setCookie:function(name, value){

document.cookie = name+"="+value;

},

fadebuttons:function(config, currentpanel){

config.$leftnavbutton.fadeTo('fast', currentpanel==0? this.defaultbuttonsfade : 1);

config.$rightnavbutton.fadeTo('fast', currentpanel==config.lastvisiblepanel? this.defaultbuttonsfade : 1);

},

addnavbuttons:function(config, currentpanel){

config.$leftnavbutton=$('<img src="'+config.defaultbuttons.leftnav[0]+'">').css({zIndex:50, position:'absolute', left:config.offsets.left+config.defaultbuttons.leftnav[1]+'px', top:config.offsets.top+config.defaultbuttons.leftnav[2]+'px', cursor:'hand', cursor:'pointer'}).attr({title:'Back '+config.defaultbuttons.moveby+' panels'}).appendTo('body');

config.$rightnavbutton=$('<img src="'+config.defaultbuttons.rightnav[0]+'">').css({zIndex:50, position:'absolute', left:config.offsets.left+config.$gallery.get(0).offsetWidth+config.defaultbuttons.rightnav[1]+'px', top:config.offsets.top+config.defaultbuttons.rightnav[2]+'px', cursor:'hand', cursor:'pointer'}).attr({title:'Forward '+config.defaultbuttons.moveby+' panels'}).appendTo('body');

config.$leftnavbutton.bind('click', function(){ //assign nav button event handlers

stepcarousel.stepBy(config.galleryid, -config.defaultbuttons.moveby);

});

config.$rightnavbutton.bind('click', function(){ //assign nav button event handlers

stepcarousel.stepBy(config.galleryid, config.defaultbuttons.moveby);

});

if (config.panelbehavior.wraparound==false){ //if carousel viewer should stop at first or last panel (instead of wrap back or forth)

this.fadebuttons(config, currentpanel);

}

},

alignpanels:function($, config){

var paneloffset=0

config.paneloffsets=[paneloffset] //array to store upper left offset of each panel (1st element=0)

config.panelwidths=[] //array to store widths of each panel

config.$panels.each(function(index){ //loop through panels

var $currentpanel=$(this);

$currentpanel.css({float: 'none', position: 'absolute', left: paneloffset+'px'}); //position panel

$currentpanel.bind('click', function(e){return config.onpanelclick(e.target);}); //bind onpanelclick() to onclick event

paneloffset+=stepcarousel.getCSSValue($currentpanel.css('marginRight')) + parseInt($currentpanel.get(0).offsetWidth || $currentpanel.css('width')); //calculate next panel offset

config.paneloffsets.push(paneloffset); //remember this offset

config.panelwidths.push(paneloffset-config.paneloffsets[config.paneloffsets.length-2]); //remember panel width

})

config.paneloffsets.pop(); //delete last offset (redundant)

var addpanelwidths=0;

var lastpanelindex=config.$panels.length-1;

config.lastvisiblepanel=lastpanelindex;

for (var i=config.$panels.length-1; i>=0; i=i-1){

addpanelwidths+=(i==lastpanelindex? config.panelwidths[lastpanelindex] : config.paneloffsets[i+1]-config.paneloffsets[i]);

if (config.gallerywidth>addpanelwidths){

config.lastvisiblepanel=i; //calculate index of panel that when in 1st position reveals the very last panel all at once based on gallery width

}

}

config.$belt.css({width: paneloffset+'px'}); //Set Belt DIV to total panels' widths

config.currentpanel=(config.panelbehavior.persist)? parseInt(this.getCookie(window[config.galleryid+"persist"])) : 0; //determine 1st panel to show by default

config.currentpanel=(typeof config.currentpanel=="number" && config.currentpanel<config.$panels.length)? config.currentpanel : 0;

if (config.currentpanel!=0){

var endpoint=config.paneloffsets[config.currentpanel]+(config.currentpanel==0? 0 : config.beltoffset);

config.$belt.css({left: -endpoint+'px'});

}

if (config.defaultbuttons.enable==true){ //if enable default back/forth nav buttons

this.addnavbuttons(config, config.currentpanel);

$(window).bind("load", function(){ //refresh position of nav buttons when page loads, in case offsets weren't available document.oncontentload

config.offsets={left:stepcarousel.getoffset(config.$gallery.get(0), "offsetLeft"), top:stepcarousel.getoffset(config.$gallery.get(0), "offsetTop")};

config.$leftnavbutton.css({left:config.offsets.left+config.defaultbuttons.leftnav[1]+'px', top:config.offsets.top+config.defaultbuttons.leftnav[2]+'px'});

config.$rightnavbutton.css({left:config.offsets.left+config.$gallery.get(0).offsetWidth+config.defaultbuttons.rightnav[1]+'px', top:config.offsets.top+config.defaultbuttons.rightnav[2]+'px'});

});

}

this.statusreport(config.galleryid);

config.oninit();

config.onslideaction(this);

},

stepTo:function(galleryid, pindex){ /*User entered pindex starts at 1 for intuitiveness. Internally pindex still starts at 0 */

var config=stepcarousel.configholder[galleryid];

if (typeof config=="undefined"){

alert("There's an error with your set up of Carousel Viewer \""+galleryid+ "\"!");

return;

}

var pindex=Math.min(pindex-1, config.paneloffsets.length-1);

var endpoint=config.paneloffsets[pindex]+(pindex==0? 0 : config.beltoffset);

if (config.panelbehavior.wraparound==false && config.defaultbuttons.enable==true){ //if carousel viewer should stop at first or last panel (instead of wrap back or forth)

this.fadebuttons(config, pindex);

}

config.$belt.animate({left: -endpoint+'px'}, config.panelbehavior.speed, function(){config.onslideaction(this)});

config.currentpanel=pindex;

this.statusreport(galleryid);

},

stepBy:function(galleryid, steps){

var config=stepcarousel.configholder[galleryid];

if (typeof config=="undefined"){

alert("There's an error with your set up of Carousel Viewer \""+galleryid+ "\"!");

return;

}

var direction=(steps>0)? 'forward' : 'back'; //If "steps" is negative, that means backwards

var pindex=config.currentpanel+steps ;//index of panel to stop at

if (config.panelbehavior.wraparound==false){ //if carousel viewer should stop at first or last panel (instead of wrap back or forth)

pindex=(direction=="back" && pindex<=0)? 0 : (direction=="forward")? Math.min(pindex, config.lastvisiblepanel) : pindex;

if (config.defaultbuttons.enable==true){ //if default nav buttons are enabled, fade them in and out depending on if at start or end of carousel

stepcarousel.fadebuttons(config, pindex);

}

}

else{ //else, for normal stepBy behavior

pindex=(pindex>config.paneloffsets.length-1 || pindex<0 && pindex-steps>0)? 0 : (pindex<0)? config.paneloffsets.length+steps : pindex; //take into account end or starting panel and step direction

}

var endpoint=config.paneloffsets[pindex]+(pindex==0? 0 : config.beltoffset); //left distance for Belt DIV to travel to

if (pindex==0 && direction=='forward' || config.currentpanel==0 && direction=='back' && config.panelbehavior.wraparound==true){ //decide whether to apply "push pull" effect

config.$belt.animate({left: -config.paneloffsets[config.currentpanel]-(direction=='forward'? 100 : -30)+'px'}, 'normal', function(){

config.$belt.animate({left: -endpoint+'px'}, config.panelbehavior.speed, function(){config.onslideaction(this);});

});

}

else

config.$belt.animate({left: -endpoint+'px'}, config.panelbehavior.speed, function(){config.onslideaction(this);});

config.currentpanel=pindex;

this.statusreport(galleryid);

},

statusreport:function(galleryid){

var config=stepcarousel.configholder[galleryid];

var startpoint=config.currentpanel; //index of first visible panel

var visiblewidth=0;

for (var endpoint=startpoint; endpoint<config.paneloffsets.length; endpoint++){ //index (endpoint) of last visible panel

visiblewidth+=config.panelwidths[endpoint];

if (visiblewidth>config.gallerywidth){

break;

}

}

startpoint+=1; //format startpoint for user friendiness

endpoint=(endpoint+1==startpoint)? startpoint : endpoint; //If only one image visible on the screen and partially hidden, set endpoint to startpoint

var valuearray=[startpoint, endpoint, config.panelwidths.length];

for (var i=0; i<config.statusvars.length; i++){

window[config.statusvars[i]]=valuearray[i]; //Define variable (with user specified name) and set to one of the status values

config.$statusobjs[i].text(valuearray[i]+" "); //Populate element on page with ID="user specified name" with one of the status values

}

},

setup:function(config){

//Disable Step Gallery scrollbars ASAP dynamically (enabled for sake of users with JS disabled)

document.write('<style type="text/css">\n#'+config.galleryid+'{overflow: hidden;}\n</style>');

jQuery(document).ready(function($){

config.$gallery=$('#'+config.galleryid);

config.gallerywidth=config.$gallery.width();

config.offsets={left:stepcarousel.getoffset(config.$gallery.get(0), "offsetLeft"), top:stepcarousel.getoffset(config.$gallery.get(0), "offsetTop")};

config.$belt=config.$gallery.find('.'+config.beltclass); //Find Belt DIV that contains all the panels

config.$panels=config.$gallery.find('.'+config.panelclass); //Find Panel DIVs that each contain a slide

config.onpanelclick=(typeof config.onpanelclick=="undefined")? function(target){} : config.onpanelclick; //attach custom "onpanelclick" event handler

config.onslideaction=(typeof config.onslide=="undefined")? function(){} : function(beltobj){$(beltobj).stop(); config.onslide();}; //attach custom "onslide" event handler

config.oninit=(typeof config.oninit=="undefined")? function(){} : config.oninit;//attach custom "oninit" event handler

config.beltoffset=stepcarousel.getCSSValue(config.$belt.css('marginLeft')); //Find length of Belt DIV's left margin

config.statusvars=config.statusvars || [];  //get variable names that will hold "start", "end", and "total" slides info

config.$statusobjs=[$('#'+config.statusvars[0]), $('#'+config.statusvars[1]), $('#'+config.statusvars[2])];

config.currentpanel=0;

stepcarousel.configholder[config.galleryid]=config; //store config parameter as a variable

if (config.contenttype[0]=="ajax" && typeof config.contenttype[1]!="undefined") //fetch ajax content?

stepcarousel.getremotepanels($, config);

else

stepcarousel.alignpanels($, config); //align panels and initialize gallery

}) //end document.ready

jQuery(window).bind('unload', function(){ //clean up

if (config.panelbehavior.persist){

stepcarousel.setCookie(window[config.galleryid+"persist"], config.currentpanel);

}

jQuery.each(config, function(ai, oi){

oi=null;

})

config=null;

});

}

};

 

 

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: