सीएसएस: स्क्रीन के केंद्र में स्थिति लोडिंग सूचक

मैं स्क्रीन के केंद्र में अपने लोडिंग सूचक को कैसे रख सकता हूं। वर्तमान में मैं थोड़ा प्लेसहोल्डर का उपयोग कर रहा हूं और ऐसा लगता है कि यह ठीक काम करता है। हालांकि, जब मैं नीचे स्क्रॉल करता हूं, तो लोडिंग सूचक उस पूर्वनिर्धारित स्थिति में सही रहता है। मैं इसे स्क्रॉलिंग का पालन कैसे कर सकता हूं ताकि यह हमेशा शीर्ष पर बैठे ??सीएसएस: स्क्रीन के केंद्र में स्थिति लोडिंग सूचक

#busy 
{ 
    position: absolute; 
    left: 50%; 
    top: 35%; 
    display: none; 
    background: transparent url("../images/loading-big.gif"); 
    z-index: 1000; 
    height: 31px; 
    width: 31px; 
} 

#busy-holder 
{ 
    background: transparent; 
    width: 100%; 
    height: 100%;   
}

स्रोत

2011-06-06 Frank Vilea

मुझे आपकी समस्या के बारे में निश्चित नहीं है। शायद स्थिति: तय। एचटीएमएल मदद करेगा। – Jawad

उपयोग position:fixed बजाय position:absolute

पहले एक अपनी स्क्रीन खिड़की के सापेक्ष है करने के लिए व्यस्त। (स्क्रॉलिंग से प्रभावित नहीं)

दूसरा पृष्ठ के सापेक्ष है। (स्क्रॉलिंग से प्रभावित)

नोट: आईई 6 स्थिति का समर्थन नहीं करता है: निश्चित।

स्रोत

2011-06-06 18:00:03 Kraz

@ क्राज़: अगला प्रश्न यह है कि वर्तमान व्यूपोर्ट के अनुसार, विशिष्ट div के केंद्र में यह कैसे करें: http://stackoverflow.com/questions/17762818/how-to-center-image-in-the- विशिष्ट -डिव-के अनुसार-वर्तमान-व्यूपोर्ट-स्थिति – noisy

afaik, वर्तमान में यह केवल सीएसएस में करने योग्य नहीं है। 'स्थिति' की आवश्यकता होगी: पूर्ण '('निश्चित' काम नहीं करेगा) और अन्य जावास्क्रिप्ट के साथ निर्धारित मूल्य (शीर्ष, दाएं ...)। – Kraz

परिवर्तन स्थिति div की पूर्णतः निश्चित

स्रोत

2011-06-06 17:59:08

.loader{ 
 
position: fixed; 
 
    left: 0px; 
 
    top: 0px; 
 
    width: 100%; 
 
    height: 100%; 
 
    z-index: 9999; 
 
    background: url('../img/loaderred.gif') 50% 50% no-repeat rgb(249,249,249); 
 
}

<div class="loader"></div>

स्रोत

2015-03-25 18:42:26

यह मैं कोणीय 4 के लिए क्या किया है है: जोड़कर

<style type="text/css"> 
    .centered { 
    position: fixed; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%); 
    transform: -webkit-translate(-50%, -50%); 
    transform: -moz-translate(-50%, -50%); 
    transform: -ms-translate(-50%, -50%); 
    color:darkred; 
    } 
</style> 

</head> 

<body> 
    <app-root> 
     <div class="centered"> 
      <h1>Loading...</h1> 
     </div> 
    </app-root> 
</body>

स्रोत

2017-06-24 18:36:32 Salim

कोणीय 4

में मेरे लिए काम किया style="margin:0 auto;"

<mat-progress-spinner 
    style="margin:0 auto;" 
    *ngIf="isLoading" 
    mode="indeterminate"> 
    </mat-progress-spinner>

स्रोत

2017-12-20 06:13:06

सीएसएस: स्क्रीन के केंद्र में स्थिति लोडिंग सूचक

उत्तर

संबंधित मुद्दे