Search the Community
Showing results for tags 'css wp'.
-
Sveiki, man radušās pāris problēmiņas ar Wordpress. Respektīvi, vēlos nedaudz rediģēt linku lapu veidni (template). Tad nu tā, lieta tāda, ka uzejot ar peli uz bildes (kā parādīts attēlā) uzlec teksts ar ikonām un fonu. Lietas ko vēlētos parediģēt: Izlabot CSS tā, lai teksts rādītos pa visu attēlu (nevis tikai daļu, kur beigās ir [...] ) Izņemt peles kursora hover teksta lodziņu (kas tāpat rādās nesakarīgi) noņemt bezjēdzīgo lapas ritinātāju labajā pusē Parādīju arī nedaudz visu grafiski, lai ir kautkāda saprašana. Tad vēl paskatījos, un atradu PHP un CSS lapas template. Tad vēl uzgāju pāris kodus. <?php /** * Template Name: Portfolio Fullsize Scroller * * @package WordPress * @subpackage Invictus * @since Invictus 1.0 */ global $meta; $meta = max_get_cutom_meta_array(); $meta_scroller_height = get_post_meta($post->ID, MAX_SHORTNAME.'_max_scroller_height', TRUE); $scroller_height = !empty($meta_scroller_height) ? $meta_scroller_height : 0; get_header(); // show the item caption of an image on hover? $itemCaption = true; // Hide the excerpt on hover? $hideExcerpt = false; ?> <div id="primary" class="clearfix portfolio-fullsize-scroller<?php if ( post_password_required() ) : ?> portfolio-fullsize-closed<?php endif; ?>"> <div id="content" role="main" class="clearfix"> <header class="entry-header"> <h1 class="page-title"><?php the_title(); ?></h1> <?php // check if there is a excerpt if( max_get_the_excerpt() ){ ?> <h2 class="page-description"><?php max_get_the_excerpt(false) ?></h2> <?php } ?> </header><!-- .entry-header --> <?php /* -- added 2.0 -- */ ?> <?php the_content() ?> <?php /* -- end -- */ ?> <?php if ( !post_password_required() ) { ?> <div id="customScroller" class="scroll-pane"> <div class="scroll-content"> <?php // including the loop template gallery-loop.php get_template_part( 'includes/gallery', 'loop.inc' ); ?> </div> <a href="#scroll-left" id="scroll_left" class="scroller-arrow disabled">Scroll Left</a> <a href="#scroll-right" id="scroll_right" class="scroller-arrow">Scroll Right</a> <div class="scroll-bar-wrap ui-widget-content ui-corner-bottom"> <div class="scroll-bar"></div> </div> <div class="overlay"></div> </div> <?php } ?> </div><!-- #content --> </div><!-- #container --> <?php get_footer(); ?> un tad vēl css'ā atradu pāris rindas ar šo te: /** Scrollable Fullsize Portfolio **/ .portfolio-fullsize-scroller .portfolio-list { margin: 0; } .portfolio-fullsize-scroller .portfolio-list li { margin: 0 10px 22px 0; display: block; } .portfolio-fullsize-scroller .portfolio-list li:last-child { margin-right: 0; } .portfolio-fullsize-scroller .scroll-content { width: 100000px; } /* set it to extra large to not break images in two or more lines on load */ .portfolio-fullsize-scroller .scroll-pane { overflow: hidden; width: 100%; float: left; position: relative; padding: 0 0 13px; } .portfolio-fullsize-scroller .scroll-content { float: left; } .portfolio-fullsize-scroller .scroll-pane .overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; z-index: 1; display: none; } .portfolio-fullsize-scroller .scroll-bar-wrap { position: absolute; margin: 0; bottom: 0;0 height: 50px; right: 0; left: 0; } .portfolio-fullsize-scroller .scroll-bar { margin: 0; position: absolute; bottom: 0; left: 0; height: 12px; } .portfolio-fullsize-scroller .scroll-bar a.ui-slider-handle { display: block; position: absolute; top: 1px; width: 64px; height: 10px; color: rgba(0,0,0,.5); text-shadow: 0 1px 0 rgba(255,255,255,.3); text-align: center; line-height: 1; padding: 0; font-size: 10px; text-decoration: none; letter-spacing: 2px; font-weight: bold; background-image: -webkit-linear-gradient(top, rgba(242, 242, 242, 0.25), rgba(209, 209, 209, 0)); background-image: -moz-linear-gradient(top, rgba(242, 242, 242, 0.25), rgba(209, 209, 209, 0)); background-image: -o-linear-gradient(top, rgba(242, 242, 242, 0.25), rgba(209, 209, 209, 0)); background-image: -ms-linear-gradient(top, rgba(242, 242, 242, 0.25), rgba(209, 209, 209, 0)); background-image: linear-gradient(top, rgba(242, 242, 242, 0.25), rgba(209, 209, 209, 0)); } .portfolio-fullsize-scroller a.scroller-arrow { position: absolute; display: block; text-indent: -999em; z-index: 20; top: 50%; margin-top: -32px; width: 52px; height: 64px; display: none; } .portfolio-fullsize-scroller a#scroll_left { left: 0; background-position: 0 50%; } .portfolio-fullsize-scroller a#scroll_right { right: 0; background-position: 100% 50%; } .portfolio-fullsize-scroller a.disabled { display: none; } Tad nu tā, vēlējos uzzināt, kur ir aprakstīts tieši par to, kur uzlecošais logs uz hover atbilst tā teksta garumam? Kāds varbūt var palīdzēt? Būtu ļoti pateicīgs. Parādā nepalikšu! :)