سؤال

عند استخدام عدة قوائم الدول تحوم 'الأم' Cufon نمط يستبدل الطفل.في المثال التالي, عندما كنت تحوم المستوى الثاني الرابط سيتم استبداله وزن مختلف.

هل هناك خيار يمكنني تعيين بحيث متداخلة نمط يبقى نفس أو هذا الخلل/القيد في Cufon?

    <ul>
    <li><a href="#">Top Level</a></li>
    <li><a href="#">Top Level</a></li>
    <li><a href="#">Top Level</a><ul>
        <li><a href="#">Second Level</a></li>
        <li><a href="#">Second Level</a></li>
        <li><a href="#">Second Level</a></li>
    </ul>
    <li><a href="#">Top Level</a></li>
    <li><a href="#">Top Level</a></li>
</ul>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://github.com/sorccu/cufon/raw/master/js/cufon.js"></script>
<script type="text/javascript" src="http://github.com/sorccu/cufon/raw/master/fonts/Vegur.font.js"></script>


<script type="text/javascript">
    Cufon.replace('ul li a',{hover: true, fontWeight: 200});
    Cufon.replace('ul li ul a',{hover: true, fontWeight: 700}); 
</script>
هل كانت مفيدة؟

المحلول

الحل الأول: استخدام محددات الذي لا خلق مباريات حيث مجموعة من عناصر التداخل.

//selects only 1st level links
Cufon.replace('ul:has(ul) > li   a', { hover: true, fontWeight: 200});
//selects only 2nd level links
Cufon.replace('ul:not(:has(ul)) a', { hover: true, fontWeight: 700});




تفسير لماذا محددات + Cufon خلق المشاكل

يبدو أن المشكلة تنشأ من محددات.

ul li a --> selects all 8 occurrences of <a>
ul li ul a --> selects only the 3 second-level occurrences of <a>

هذا يعني أن لديك في الواقع المحدد fontWeight مرتين المستوى الثاني <a>-العلامات.للأسف Cufon لا يبدو أن تطبق فقط التعبير التي لديها أعلى CSS خصوصية وبالتالي سلوك يعتمد على مدى Cufon داخليا مخازن مباريات متعددة مثل هذا واحد.

بعد بضعة اختبارات يبدو أن Cufon يطبق الأساليب في ترتيب عكسي استدعاء replace() البيانات في.على سبيل المثال

إذا كنت تفعل

Cufon.replace('ul li a',{hover: true, fontWeight: 200});
Cufon.replace('ul li ul a',{hover: true, fontWeight: 700});

جميع الروابط سوف تظهر الأزرق 2-المستوى الروابط fontWeight 700 حتى حامت ، ثم الحصول على fontWeight 200 مجموعة.

إذا قمت بالتبديل النظام

Cufon.replace('ul li ul a',{hover: true, fontWeight: 700});
Cufon.replace('ul li a',{hover: true, fontWeight: 200});

في البداية جميع الروابط سوف يكون fontWeight 200 ، 2-المستوى الروابط سوف تحصل على 700 تعيين عندما حامت.

لاحظت التغييرات في السلوك اعتمادا على المكالمات الخاصة بك.



اليقين

أنا لا أعرف Cufon و أنا لا أفهم حقا ما كنت تحاول القيام به.خصوصا أنني لست متأكدا إذا كنت تقصد استخدام خيارات مرت في Cufon كما تفعل أو إذا كنت تعني في الواقع مجرد مجموعة fontWeight عندما تحوم.

هناك فرق بين

Cufon.replace('ul li a', { hover: true, fontWeight: 200 } );

و

Cufon.replace('ul li a', {
    hover: { fontWeight: 200 }
});

أول مجموعات fontWeight 200 و إذا كان العنصر هو حامت أيضا مجموعات fontWeight إلى 200 وحده ملحوظة إذا كان fontWeight تغيرت في الوقت الحالي.

هذا الأخير إلا تغييرات نمط عنصر fontWeight 200 بينما حامت ويزيل الوزن عند العنصر لم يعد حامت.

لست متأكد أي واحد كنت تنوي استخدام.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top