2014-10-07 14 views
6

मैं मुसीबत को लागू कर रहा हूँ निम्नलिखित:फिक्स्ड कॉलम और साथ हैडर सीएसएस/जे एस कोणीय

  1. तालिका की शीर्ष
  2. पहले 4/5 स्तंभों को स्थिर करना ठीक है और बाकी स्क्रॉल करने के लिए ठीक करें क्षैतिज
  3. तालिका एक div निश्चित ऊंचाई का है और चौड़ाई

मैं कर रहा हूँ के अंदर होना चाहिए हेडर को ठीक करें, मैं # 2 प्राप्त करने में सक्षम नहीं हूं। तालिका पृष्ठ पर एक फलक के अंदर है। तो मैं # 2 प्राप्त करने के लिए कॉलम को ठीक करने के लिए वास्तव में position:absolute का उपयोग नहीं कर सकता।

मैंने इसे प्राप्त करने के लिए ऑनलाइन कुछ उदाहरणों की कोशिश की, लेकिन मुझे ऐसा करने के लिए एक कोणीय जेएस निर्देश बनाने की आवश्यकता है। मैं AngularJS के लिए नया हूं, हालांकि, मैंने नीचे दिए गए उदाहरण को ट्विक करने की कोशिश की लेकिन कोई किस्मत नहीं।

https://www.pointblankdevelopment.com.au/blog/angularjs-fixed-header-scrollable-table-directive

एक सीएसएस तरीका यह है में भी मदद मिलेगी पर कोई मदद करते हैं।

मैंने जो भी करने की कोशिश कर रहा हूं उसके लिए मैंने प्लंकर भी जोड़ा। तो मैं उदाहरण में पहले 2 कॉलम जमा करना चाहता हूं।

http://plnkr.co/edit/iKwNrqT1Gy1oDvyK6FFN?p=preview

+0

यदि आप अपने प्रयासों के साथ एक jsbin/jsfiddle/plunker स्थापित करेंगे तो यह सहायक होगा। – haki

+0

मैंने http://jsfiddle.net/zS7Ny/ जैसे कई तालिकाओं का उपयोग करने की कोशिश की लेकिन मैं 2 टेबल का उपयोग नहीं करना चाहता क्योंकि डेटा एक ही सूची है जिसे मुझे दो बार फिर से करने की आवश्यकता है। –

+0

क्या आप क्षैतिज स्क्रॉल केवल 'विशिष्ट कॉलम' पर लागू करना चाहते हैं? क्या आपने jthe से यह [answer] (http://stackoverflow.com/a/21778035/967638) आज़माया था। – Amarnath

उत्तर

-1

तुम सिर्फ thead में और पंक्तियां जोड़ देते हैं तो यह स्वचालित रूप से के रूप में निर्देश करने के लिए कहता है आप के लिए उन्हें ठीक कर देंगे।

यहाँ देखें: http://embed.plnkr.co/CmJBfd/preview

इस प्रकार, तुम सब करने की है अपनी पंक्तियों है कि आप शीर्ष लेख की तरह लग रही है और उन्हें पंक्तियों की तरह शैली नहीं करना चाहते पर एक कस्टम वर्ग डाल दिया है।

+1

इसमें जमे हुए कॉलम नहीं हैं जैसे कि पूछे गए –

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