- This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
-
When testing this in firefox I noticed that the page would never finish loading.
Couldn’t figure out why.
HTML:
Discovery Center
Use me!
CSS:
/*
AnythingSlider v1.5.10 Minimalist Round Theme
By Rob Garrison
*/
/* General Stuff */
a, a img { border: 0; text-decoration: none; }
#page-wrap, { width: 90%; padding: 15px; margin: 0 auto 50px; position: relative; }
h1 { font: bold 60px Helvetica, Sans-Serif; letter-spacing: -2px; margin: 20px 0; text-align: center; }
/* This CSS is needed for the fading transition */
#slider { background: #000; } /* black background makes fading less flashy */
#slider .panel { opacity: 0; }
#slider .panel.activePage { opacity: 1; } /* make sure active panel is visible */
/****** SET COLORS HERE *******/
/* Default State */
div.anythingSlider-minimalist-round .thumbNav a {
border: 1px solid #000;
background: #333;
}
div.anythingSlider-minimalist-round .thumbNav a:hover, div.anythingSlider-minimalist-round .thumbNav a.cur {
background: #777;
}
div.anythingSlider-minimalist-round .start-stop {
border: 1px solid #000;
}
div.anythingSlider-minimalist-round .start-stop.playing {
background-color: #300;
}
div.anythingSlider-minimalist-round .start-stop:hover, div.anythingSlider-minimalist-round .start-stop.hover {
color: #ddd;
}
/* Active State */
div.anythingSlider-minimalist-round.activeSlider .anythingWindow {
border-color: #164054;
}
div.anythingSlider-minimalist-round.activeSlider .thumbNav a {
background-color: #164054;
}
div.anythingSlider-minimalist-round.activeSlider .thumbNav a:hover, div.anythingSlider-minimalist-round.activeSlider .thumbNav a.cur {
background: #fff;
}
div.anythingSlider-minimalist-round.activeSlider .start-stop.playing {
background-color: #f00;
}
div.anythingSlider-minimalist-round .start-stop:hover, div.anythingSlider-minimalist-round .start-stop.hover {
color: #fff;
}
/* Navigation Arrows */
div.anythingSlider-minimalist-round .arrow {
top: 50%;
position: absolute;
display: block;
}
div.anythingSlider-minimalist-round .arrow a {
display: block;
height: 40px;
margin-top: -20px; /* half height of image */
width: 30px;
text-align: center;
outline: 0;
background: url(../images/arrows-minimalist.png) no-repeat;
}
div.anythingSlider-minimalist-round .forward { right: 0; }
div.anythingSlider-minimalist-round .back { left: 0; }
div.anythingSlider-minimalist-round .forward a { background-position: right bottom; }
div.anythingSlider-minimalist-round .back a { background-position: left bottom; }
div.anythingSlider-minimalist-round .forward a:hover, div.anythingSlider-minimalist-round .forward a.hover { background-position: right top; }
div.anythingSlider-minimalist-round .back a:hover, div.anythingSlider-minimalist-round .back a.hover { background-position: left top; }
/* Navigation Links */
div.anythingSlider-minimalist-round .anythingControls {
position: absolute;
width: 80%;
bottom: 10px;
right: 5%;
z-index: 100;
opacity: 0.90;
filter: alpha(opacity=90);
}
div.anythingSlider-minimalist-round .thumbNav {
float: right;
margin: 0;
z-index: 100;
}
div.anythingSlider-minimalist-round .thumbNav li {
display: block;
float: left;
}
div.anythingSlider-minimalist-round .thumbNav a {
display: block;
height: 10px;
width: 10px;
margin: 3px;
padding: 0;
outline: 0;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
/* slider autoplay right-to-left, reverse order of nav links to look better */
div.anythingSlider-minimalist-round.rtl .thumbNav a { float: right; } /* reverse order of nav links */
div.anythingSlider-minimalist-round.rtl .thumbNav { float: left; } /* move nav link group to left */
/* div.anythingSlider-minimalist-round.rtl .start-stop { float: right; } */ /* move start/stop button - in case you want to switch sides */
/* Autoplay Start/Stop button */
div.anythingSlider-minimalist-round .start-stop {
margin: 3px;
padding: 0;
display: inline-block;
width: 14px;
height: 14px;
position: relative;
bottom: 2px;
left: 0;
z-index: 100;
text-align: center;
text-decoration: none;
float: right;
border-radius: 7px;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
}
/* Extra - replace defaults */
div.anythingSlider-minimalist-round {
padding: 6px 30px;
}
/* text indent moved to span inside "a", for IE7; apparently, a negative text-indent on an "a" link moves the link as well as the text */
div.anythingSlider-minimalist-round .arrow a span, div.anythingSlider-minimalist-round .thumbNav a span, div.anythingSlider-minimalist-round .start-stop span {
display: block;
line-height: 1px; /* needed for IE7 */
text-indent: -9999px;
}
Viewing 2 posts - 1 through 2 (of 2 total)
- The forum ‘JavaScript’ is closed to new topics and replies.
