Позиция фиксируется внутри родительского div при прокрутке - PullRequest
0 голосов
/ 14 июля 2020

.nav-tabs1 {
    justify-content: center;
    text-align: center;
    position: fixed;
    display: block;
    right: -70px;
    top: 0;
}

.parentdiv{
  position: relative
}
<div class="parentdiv">
               
                <div class="row row-pos">
                        <div class="tab-tab">
                     
                                <nav>
                                <ul class="nav nav-tabs1" id="nav-tab" role="tablist">

                                <?php $terms = get_terms('menucategory');
                                $count = 0;
                                foreach($terms as $term){ ?>

                                <li class="nav-item">
                                    <a class="nav-link <?php echo $count == 0 ? 'active' : ''?>" data-toggle="tab" href='#<?php echo $term->slug;?>' id="<?php echo $term->slug;?>-tab" role="tab" aria-controls="<?php echo $term->slug;?>" aria-selected="true">
                                        <img src="<?= $image = get_field('img_section1s', $term); ?>" alt="">
                                        <?php
                                        echo $term->name;
                                        ?>
                                    </a>
                                </li>
                               
                                <?php
                                $count++; } 
                                ?>
                                </ul>
                                </nav>
            
                        </div>
                </div>
                
                <div class="tab-content col-12">
                        
                    <?php $terms = get_terms('menucategory');
                    $count = 0;
                    foreach($terms as $term): ?>
                        
                     <div class="tab-pane row fade <?php echo $count == 0 ? 'active show' : ''?>" id="<?php echo $term->slug;?>" role="tabpanel" aria-labelledby="<?php echo $term->slug;?>-tab">
                        <div class="row">
                        <?php
                        $args = array(
                        'post_type' => 'menu',
                        'posts_per_page' => '10',
                        'order' => 'ASC',
                        'taxonomy_pe_page'=>'9',
                        'menucategory' => $term->slug,
                        );
                        $loop = new WP_Query($args);
                        while($loop->have_posts()):
                        $loop->the_post();
                        ?>
                      
                      <div class="col-lg-6 post__elements__pd">
                            <div class="post__elements">

                                <div class="img__post">
                                        <?php the_post_thumbnail(); ?>
                                </div>
                                <div class="cont-pos__post">
                                <div class="tit-pr__post">
                                        <h1><?php the_title();?></h1>
                                        <h2><?php the_excerpt();?>CHF</h2>
                                </div>
                                <div class="conte-txt__post">
                                        <?php the_content();?>
                                </div>
                                </div>
                            </div>
                        </div>
                           
                        <?php endwhile; 
                        wp_reset_postdata();?>
                        </div>
                      </div>
                     <?php
                     $count++;
                     endforeach;?>
                     </div>   
                    
               
                <div class="btn1">
                        <a href="<?php the_field('button_menu'); ?>"> <?php the_field('button_menu_name'); ?> </a>
                </div>
                </div>

Мне нужно получить фиксированную позицию для div «X», который находится внутри другого div «Y», и когда я прокручиваю «Y», его нужно исправить .

Надеюсь, я прояснил мою просьбу! С этими 3 пи c я пытаюсь объяснить, что я хочу:

PI C 1: div "Y" имеет сообщения, а div "X" находится внутри "Y"

enter image description here

PIC 2: there is bottom of "Y" div and there is "X" which comes when i scroll

enter image description here

PIC 3: But there is a problem, divX has position fixed but when i scroll outside parent div i dont want to get outside parent ( outside red-line )

I hope you understand clearely my question and anyne can help me, im trying it since long time!!

введите описание изображения здесь

...