ریسپانسیو نبودن ویدئوهای آپارات در سایت در نمایش کامپیوتر و گوشی همراه

[projectorbartar]

سلام.

ابعاد ویدئو های آپارات 150*300 می باشند. من دنبال این هستم که ابعاد ویدئوها در کامپیوتر 300*600 باشد و در گوشی 150*300

قبلا در انجمن مطلبی نوشته بودین که کلاس class="block-me" را اضافه کنیم که تاثیری نداشت. سپس کلاس class="img-responsive" را نوشتم اما باز تقییری حاصل نشد. وقتی کد آپارات را در سایت جایگذاری میکنم، ویدئو آپارات دارای ابعاد 150*300 می باشد که برای کامپیوتر کوچک است و برای گوشی ایده آل.

من بصورت زیر برای یک ویدئو عمل کردم:

کد iframe  آپارات را در قسمت ویدئو سایتم کپی کردم.  ابعاد ویدئو را 2 برابر کردم تا در کامپیوتر بزرگتر نمایش داده شود. در این حالت، ابعاد ویدئو در گوشی به هم میریزد.

<style>.h_iframe-aparat_embed_frame{position:relative;} .h_iframe-aparat_embed_frame .ratio {display:block;width:100%;height:auto;} .h_iframe-aparat_embed_frame iframe {position:absolute;top:0;left:0;width:100%; height:100%;}</style><div class="h_iframe-aparat_embed_frame"> <span style="display: block;padding-top: 57%"></span><iframe src="https://www.aparat.com/video/video/embed/videohash/sUXFx/vt/frame"allowFullScreen="true" webkitallowfullscreen="true" mozallowfullscreen="true" ></iframe></div>

1- قسمت bold شده را با کد div class="img-responsive" جایگزین کردم و تغییری نیافت.

2- در سری دوم کد <div class="img-responsive"></div> را در جلوی قسمت bold شده اضافه کردم و تغییری حاصل نشد.

ممنون میشم توضیحات بیشتر برای حل مشکل بفرمایید.

 

[admin]

قبلا آموزشی در این خصوص گذاشتیم. به لینک زیر مراجعه کنید:

https://ipresta.ir/blog/41_%D8%A2%D9%85%D9%88%D8%B1%D8%B4-%D8%AF%D8%B1%D8%AC-%D9%88%DB%8C%D8%AF%DB%8C%D9%88-%D8%A7%D8%B2-%D8%A2%D9%BE%D8%A7%D8%B1%D8%A7%D8%AA-%D8%AF%D8%B1-%D9%81%D8%B1%D9%88%D8%B4%DA%AF%D8%A7%D9%87.html