/
  • Combine images using CSS sprites

  • صفحه‌ها (3):
  • ارسال پاسخ   امتیاز موضوع:
    • 0 رأی - میانگین امیتازات: 0
    • 1
    • 2
    • 3
    • 4
    • 5

    حالت موضوعی | حالت خطی Combine images using CSS sprites
    نویسنده پیام
    Mohammad.T آفلاین
    عضو جدید
    **

    ارسال‌ها: 21
    تاریخ عضویت: ۱۳۹۰ آبان ۲۲
    اعتبار: 0
    تشکرها : 16
    ( 0 تشکر در 0 ارسال )
    ارسال: #1
    Combine images using CSS sprites
    درود
    دوستان میخواستم در این مورد راهنمایی کنید که چطور میتونم این مشکل رو رفع کنم در قالب فرومم :
    http://gtmetrix.com/reports/forum.4users.ir/1EltLymL
    Combine images using CSS sprites :

    http://forum.4users.ir/images/attachtypes/doc.gif
    http://forum.4users.ir/images/collapse.gif
    http://forum.4users.ir/images/earth/bg.png
    http://forum.4users.ir/images/earth/collapse.gif
    http://forum.4users.ir/images/earth/icons/calendar.gif
    http://forum.4users.ir/images/earth/icons/login.gif
    http://forum.4users.ir/images/earth/icons/logout.gif
    http://forum.4users.ir/images/earth/icon...erlist.gif
    http://forum.4users.ir/images/earth/icons/search.gif
    http://forum.4users.ir/images/earth/minioff.gif
    http://forum.4users.ir/images/earth/miniofflock.gif
    http://forum.4users.ir/images/earth/minion.gif
    http://forum.4users.ir/images/earth/off.gif
    http://forum.4users.ir/images/earth/offlock.gif
    http://forum.4users.ir/images/earth/on.gif
    http://forum.4users.ir/images/earth/tcat.png
    http://forum.4users.ir/images/icons/music.gif
    http://forum.4users.ir/images/prostats/ps_minioff.gif
    http://forum.4users.ir/images/prostats/ps_reload.gif



    اگر درست منظورش رو فهمیده باشم میگه این عکس ها باید در سی اس اس قرار بگیرند :
    ولی به طور مثال :
    http://forum.4users.ir/images/earth/on.gif
    http://forum.4users.ir/images/earth/tcat.png
    http://forum.4users.ir/images/icons/music.gif
    و
    http://forum.4users.ir/images/earth/bg.png
    و
    http://forum.4users.ir/images/earth/icons/calendar.gif
    http://forum.4users.ir/images/earth/icons/login.gif
    http://forum.4users.ir/images/earth/icons/logout.gif
    http://forum.4users.ir/images/earth/icon...erlist.gif
    http://forum.4users.ir/images/earth/icons/search.gif

    در سی اس اس ها تعریف شده اند ولی ایراد میگیرد !
    به طور مثال برای بکگراند انجمنم :
    http://forum.4users.ir/images/earth/bg.png
    در سی اس اس :

    کد PHP:
    body {
        
    background#222 url(images/earth/bg.png);
        
    color#000;
        
    text-aligncenter;
        
    line-height1.4;
        
    margin0;
        
    font-familyTahoma;
        
    font-size12px;


    وجود دارد ولی باز سایت جی تی متریک ایراد میگیرد و وقتی یک مربع قرار میدهم قبل body دیگر ایرادی نمیگیرد ولی ضاهر سایت خراب میشود ! چه باید بکنم ؟
    یک راهنمایی جامع به من بکنید ممنون میشم سپاسسسسسسسسسسس HeartHeartHeart
    ۱۳۹۱ شهريور ۱۸ ۰۱:۱۱ عصر
    یافتن ارسال‌ها پاسخ با نقل قول
     تشکر شده توسط :
    webnevesht آفلاین
    محمدرضا سلطانی
    ***

    ارسال‌ها: 972
    تاریخ عضویت: ۱۳۹۰ آذر ۲۵
    اعتبار: 22
    تشکرها : 384
    ( 702 تشکر در 427 ارسال )
    ارسال: #2
    RE: Combine images using CSS sprites
    تمام عکس هاتونو بیارین توی این لینک و اینجا تبدیل به یک عکس کنین...
    خودش Css Sprites شو درست میکنه و یه کد Css بهتون میده با تمام استایلها...
    ساخت Css Sprites
    __________________________________________________________________________
    بنده طعم ايمان را نمي چشد، تا اينكه دريابد آنچه اتفاق نيفتاده است نمي شد كه اتفاق بيفتد؛و آنچه شده و اتفاق افتاده است,نمي شد كه نشود و اتفاق نيفتد....حضرت علي(ع)
    ۱۳۹۱ شهريور ۱۸ ۰۱:۵۴ عصر
    یافتن ارسال‌ها WWW پاسخ با نقل قول
     تشکر شده توسط : Mohammad.T ali786
    Mohammad.T آفلاین
    عضو جدید
    **

    ارسال‌ها: 21
    تاریخ عضویت: ۱۳۹۰ آبان ۲۲
    اعتبار: 0
    تشکرها : 16
    ( 0 تشکر در 0 ارسال )
    ارسال: #3
    RE: Combine images using CSS sprites
    اگر لطف کنی یه توضیح کوچیک در مورد نحوه کار با این سایت بدی ممنون میشم نیم ساعتی هست پای این سایت اصلا نفهمیدم چطور باید عکس ها رو بهش بدم !! Huh
    ۱۳۹۱ شهريور ۱۸ ۰۲:۴۶ عصر
    یافتن ارسال‌ها پاسخ با نقل قول
     تشکر شده توسط :
    webnevesht آفلاین
    محمدرضا سلطانی
    ***

    ارسال‌ها: 972
    تاریخ عضویت: ۱۳۹۰ آذر ۲۵
    اعتبار: 22
    تشکرها : 384
    ( 702 تشکر در 427 ارسال )
    ارسال: #4
    RE: Combine images using CSS sprites
    خیلی ساده عکس هاتو با drag and drop میندازی توی صفحه ای که توی این سایت هست...سمت راستش کد CSSاشو بهت میده... در آخر کار از بالای صفحه لینک دانلود رو انتخاب میکنی و عکس Sprite شده و کدهای CSSشو بهت میده
    __________________________________________________________________________
    بنده طعم ايمان را نمي چشد، تا اينكه دريابد آنچه اتفاق نيفتاده است نمي شد كه اتفاق بيفتد؛و آنچه شده و اتفاق افتاده است,نمي شد كه نشود و اتفاق نيفتد....حضرت علي(ع)
    ۱۳۹۱ شهريور ۱۸ ۰۴:۱۲ عصر
    یافتن ارسال‌ها WWW پاسخ با نقل قول
     تشکر شده توسط :
    Mohammad.T آفلاین
    عضو جدید
    **

    ارسال‌ها: 21
    تاریخ عضویت: ۱۳۹۰ آبان ۲۲
    اعتبار: 0
    تشکرها : 16
    ( 0 تشکر در 0 ارسال )
    ارسال: #5
    RE: Combine images using CSS sprites
    خیلی جالبه دقیقا همین کار رو میکنم ! ! ! ولی نمیشه

    منظورت از drag and drop اینه که عکس رو بگیرم بذارم توی اون صفحه دیگه ؟
    من اینکارو میکنم ولی نمیشه !
    (آخرین ویرایش در این ارسال: ۱۳۹۱ شهريور ۱۸ ۰۸:۵۷ عصر، توسط Mohammad.T.)
    ۱۳۹۱ شهريور ۱۸ ۰۸:۰۷ عصر
    یافتن ارسال‌ها پاسخ با نقل قول
     تشکر شده توسط :
    Mohammad.T آفلاین
    عضو جدید
    **

    ارسال‌ها: 21
    تاریخ عضویت: ۱۳۹۰ آبان ۲۲
    اعتبار: 0
    تشکرها : 16
    ( 0 تشکر در 0 ارسال )
    ارسال: #6
    RE: Combine images using CSS sprites
    فهمیدم چطوری هستش Big Grin باید از توی هاردم میگرفتم میذاشتم توی سایت من از سایت خودم مستقیم میذاشتم توی اون سایت Confused
    در هر صورت مرسی Heart

    فقط سوال مثلا بکگراند رو من گذاشتم این کد رو داده :

    کد PHP:
    .bg{
    background-position: -17px -18px;
    width21px;
    height21px;


    خوب این رو هر جا توی اون صفحه تغییر میدادم پزیشنش تغییر میکرد ( کد ها منظورم هست ) ، چطور باید استفاده کنم و چه روشی دارد - ممنونم Heart
    ۱۳۹۱ شهريور ۱۹ ۰۲:۴۷ عصر
    یافتن ارسال‌ها پاسخ با نقل قول
     تشکر شده توسط :
    webnevesht آفلاین
    محمدرضا سلطانی
    ***

    ارسال‌ها: 972
    تاریخ عضویت: ۱۳۹۰ آذر ۲۵
    اعتبار: 22
    تشکرها : 384
    ( 702 تشکر در 427 ارسال )
    ارسال: #7
    RE: Combine images using CSS sprites
    خب بکگروند فرق میکنه دیگه... المان هایی که واسه بکگروند استفاده میشه رو بذار
    __________________________________________________________________________
    بنده طعم ايمان را نمي چشد، تا اينكه دريابد آنچه اتفاق نيفتاده است نمي شد كه اتفاق بيفتد؛و آنچه شده و اتفاق افتاده است,نمي شد كه نشود و اتفاق نيفتد....حضرت علي(ع)
    ۱۳۹۱ شهريور ۱۹ ۰۳:۲۸ عصر
    یافتن ارسال‌ها WWW پاسخ با نقل قول
     تشکر شده توسط : Mohammad.T
    Mohammad.T آفلاین
    عضو جدید
    **

    ارسال‌ها: 21
    تاریخ عضویت: ۱۳۹۰ آبان ۲۲
    اعتبار: 0
    تشکرها : 16
    ( 0 تشکر در 0 ارسال )
    ارسال: #8
    RE: Combine images using CSS sprites
    خب من اصلا منظور شما رو نگرفتم
    ببینید برای تمام عکس ها پوزیشن میدهد !
    مثلا برای این عکس : [تصویر:  off.gif]

    کد PHP:
    .off{
    background-position: -426px -222px;
    width30px;
    height30px;


    کد PHP:
    Selection Toolbox
    Repeat x Delete Sprite
    .off{
    background-position: -109px -8px;
    width30px;
    height30px;


    من هر عکسی رو هر جای اون صفحه بذارم اینطور میکنه !
    ۱۳۹۱ شهريور ۱۹ ۰۳:۵۱ عصر
    یافتن ارسال‌ها پاسخ با نقل قول
     تشکر شده توسط :
    Mohammad.T آفلاین
    عضو جدید
    **

    ارسال‌ها: 21
    تاریخ عضویت: ۱۳۹۰ آبان ۲۲
    اعتبار: 0
    تشکرها : 16
    ( 0 تشکر در 0 ارسال )
    ارسال: #9
    RE: Combine images using CSS sprites
    من از دوباره اومدم با دقت به حرفات توجه کردم - در پست اول گفتی :
    نقل قول: تمام عکس هاتونو بیارین توی این لینک و اینجا تبدیل به یک عکس کنین...
    از این حرفت متوجه شدم که من باید تمام عکس ها رو بذارم توی همون صفحه بعد که دانلود میکنم یک عکس میده که اون پزیشنی که توی کد ها میده مربوط به هر عکس رو عکس اصلی است که تمام عکس ها را قرار دادم !
    من عکس رو آپلود کردم ، کدهای اسکریپت هم به کدهای سی اس اس قالبم اضافه کردم ! ! ! ! ولی عکس اصلی ( که تمام عکس ها توش هست ) به جای همه عکس ها اومد Undecided

    براتون زیپش رو گذاشتم یه چک میکنید ، ممنونم Heart


    فایل‌(های) پیوست شده
    .zip  MT.zip (اندازه: 8.07 KB / تعداد دفعات دریافت: 2)
    ۱۳۹۱ شهريور ۱۹ ۰۵:۴۱ عصر
    یافتن ارسال‌ها پاسخ با نقل قول
     تشکر شده توسط :
    Mohammad.T آفلاین
    عضو جدید
    **

    ارسال‌ها: 21
    تاریخ عضویت: ۱۳۹۰ آبان ۲۲
    اعتبار: 0
    تشکرها : 16
    ( 0 تشکر در 0 ارسال )
    ارسال: #10
    RE: Combine images using CSS sprites
    دوستان من رو راهنمایی نمیکنید ؟ Confused
    البته تا همینجاشم خیلیییییییییییی ممنونممم
    (آخرین ویرایش در این ارسال: ۱۳۹۱ شهريور ۲۱ ۱۲:۰۸ صبح، توسط Mohammad.T.)
    ۱۳۹۱ شهريور ۲۱ ۱۲:۰۷ صبح
    یافتن ارسال‌ها پاسخ با نقل قول
     تشکر شده توسط :
    « قدیمی تر | تازه‌ تر »

  • صفحه‌ها (3):
  • ارسال پاسخ
    پرش به انجمن:


    کاربرانِ درحال بازدید از این موضوع: 1 مهمان
    IranPHP.org | تماس با ما | بازگشت به بالا | بازگشت به محتوا | بایگانی | پیوند سایتی RSS