wordpress - WP 中的全屏背景图像幻灯片-6ren

wordpress - WP 中的全屏背景图像幻灯片

转载作者：行者123 更新时间：2023-11-28 05:36:01

我对代码、网络等还很陌生……但我正在学习诀窍。现在，我有一个 WP 模板，我正在尝试使用 style.css 中的代码将主页中的主幻灯片修复为全屏显示。

我找到了两个教程:Fullscreen Background Image Slideshow with CSS3和 Perfect Full Page Background Image但我不知道如何将我的代码付诸实践。我知道我必须使用纯 CSS 解决方案。

所以，在 style.css 中我有这段代码:

#hero-container {
    background-color: #FFF;
    height: 600px;
    position: relative;
}
#page-hero-container {
    background-color: #333;
    height: 300px;
    position: relative;
}
.page-hero {
    position: absolute;
    top: 0; 
    left: 0; 
    right: 0; 
    bottom: 0; 
    color: transparent;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: none;
    height: 300px;
}
#slideshow { 
    position: absolute; 
    top: 0;
    left: 0;
    width: 100%; 
    height: 600px; 
}
#slideshow > div { 
    position: absolute; 
    top: 0; 
    left: 0; 
    right: 0; 
    bottom: 0; 
    color: transparent;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: none;
}
.slideshowShadow {
    position: absolute; 
    z-index: 5;
    top: 0; 
    left: 0; 
    right: 0; 
    bottom: 0; 
    background-color: rgba(0,0,0,0.5);
}

有任何想法、教程或技巧吗？非常感谢。

编辑:HTML 代码(来自主题演示页面)

<div id="hero-container">
            <div id="slideshow">
                    <div style="display: block; background-image: url(&quot;http://mariusn.com/themes/reales-wp/wp-content/uploads/2014/12/bg-4.jpg&quot;);"></div><div style="display: none; background-image: url(&quot;http://mariusn.com/themes/reales-wp/wp-content/uploads/2014/12/bg-3.jpg&quot;);"></div><div style="display: none; background-image: url(&quot;http://mariusn.com/themes/reales-wp/wp-content/uploads/2014/12/bg-1.jpg&quot;);"></div><div style="display: none; background-image: url(&quot;http://mariusn.com/themes/reales-wp/wp-content/uploads/2014/12/bg-6.jpg&quot;);"></div><div style="display: none; background-image: url(&quot;http://mariusn.com/themes/reales-wp/wp-content/uploads/2014/12/bg-5.jpg&quot;);"></div></div>
        <div class="slideshowShadow"></div>
    <div class="home-header">
    <div class="home-logo osLight">
        <a href="http://mariusn.com/themes/reales-wp/">
            <span class="fa fa-home"></span> Reales WP        </a>
    </div>

<div class="topUserWraper">
    <a href="#" class="userNavHandler"><span class="icon-user"></span></a>
    <div class="user-nav">
        <ul>
            <li><a href="#" data-toggle="modal" data-target="#signup">Sign Up</a></li>
            <li><a href="#" data-toggle="modal" data-target="#signin">Sign In</a></li>
        </ul>
    </div>
</div>

<div class="modal fade" id="signin" role="dialog" aria-labelledby="signinLabel" aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="signinLabel">Sign In</h4>
            </div>
            <div class="modal-body">
                <form role="form" id="userLoginForm" method="post">
                    <div class="signinMessage" id="signinMessage"></div>
                                        <div id="fb-root" class=" fb_reset"><div style="position: absolute; top: -10000px; height: 0px; width: 0px;"><div><iframe name="fb_xdm_frame_http" frameborder="0" allowtransparency="true" allowfullscreen="true" scrolling="no" id="fb_xdm_frame_http" aria-hidden="true" title="Facebook Cross Domain Communication Frame" tabindex="-1" src="http://staticxx.facebook.com/connect/xd_arbiter.php?version=42#channel=f13e419e9d4375c&amp;origin=http%3A%2F%2Fmariusn.com" style="border: none;"></iframe><iframe name="fb_xdm_frame_https" frameborder="0" allowtransparency="true" allowfullscreen="true" scrolling="no" id="fb_xdm_frame_https" aria-hidden="true" title="Facebook Cross Domain Communication Frame" tabindex="-1" src="https://staticxx.facebook.com/connect/xd_arbiter.php?version=42#channel=f13e419e9d4375c&amp;origin=http%3A%2F%2Fmariusn.com" style="border: none;"></iframe></div></div><div style="position: absolute; top: -10000px; height: 0px; width: 0px;"><div></div></div></div>
                    <script>
                        window.fbAsyncInit = function() {
                            FB.init({
                                appId      : 743545722392313,
                                status     : true,
                                cookie     : true,
                                xfbml      : true,
                                version    : 'v2.1'
                            });
                        };
                        (function(d, s, id) {
                            var js, fjs = d.getElementsByTagName(s)[0];
                            if (d.getElementById(id)) return;
                            js = d.createElement(s); js.id = id;
                            js.src = "//connect.facebook.net/en_US/sdk.js";
                            fjs.parentNode.insertBefore(js, fjs);
                        }(document, 'script', 'facebook-jssdk'));
                    </script>
                    <div class="form-group">
                        <div class="btn-group-justified">
                            <a href="#" class="btn btn-lg btn-facebook" id="fbLoginBtn"><span class="fa fa-facebook pull-left"></span><span class="signinFBText">Sign In with Facebook</span></a>
                        </div>
                    </div>
                                                            <div class="form-group">
                        <div class="btn-group-justified">
                            <a href="#" class="btn btn-lg btn-google" id="googleSigninBtn"><span class="fa fa-google-plus pull-left"></span><span class="signinGText">Sign In with Google</span></a>
                        </div>
                    </div>
                                                            <div class="signOr">OR</div>
                                        <div class="form-group">
                        <input type="text" name="usernameSignin" id="usernameSignin" placeholder="Username" class="form-control">
                    </div>
                    <div class="form-group">
                        <input type="password" name="passwordSignin" id="passwordSignin" placeholder="Password" class="form-control">
                    </div>
                    <div class="form-group">
                        <div class="row">
                            <div class="col-xs-6">
                                <div class="checkbox custom-checkbox"><label><input type="checkbox" id="rememberSignin" name="rememberme" value="forever"><span class="fa fa-check"></span> Remember me</label></div>
                            </div>
                            <div class="col-xs-6 align-right">
                                <p class="help-block"><a href="#" class="text-green forgotPass">Forgot password?</a></p>
                            </div>
                        </div>
                    </div>
                    <input type="hidden" name="signinRedirect" id="signinRedirect" value="">
                    <input type="hidden" id="securitySignin" name="securitySignin" value="43d31cbed1"><input type="hidden" name="_wp_http_referer" value="/themes/reales-wp/">                    <div class="form-group">
                        <div class="btn-group-justified">
                            <a href="#" class="btn btn-lg btn-green" id="submitSignin">Sign In</a>
                        </div>
                    </div>
                    <p class="help-block">Don't have an account? <a href="#" class="modal-su text-green">Sign Up</a></p>
                </form>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="signup" role="dialog" aria-labelledby="signupLabel" aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="signupLabel">Sign Up</h4>
            </div>
            <div class="modal-body">
                <form role="form" id="userSignupForm" method="post">
                    <div class="signinMessage" id="signupMessage"></div>
                                        <div class="form-group">
                        <div class="checkbox custom-checkbox"><label><input type="checkbox" id="register_as_agent" name="register_as_agent" value="1"><span class="fa fa-check"></span> Register me as agent</label></div>
                    </div>
                                        <div class="form-group">
                        <input type="text" name="usernameSignup" id="usernameSignup" placeholder="Username" class="form-control">
                    </div>
                    <div class="form-group">
                        <input type="text" name="firstnameSignup" id="firstnameSignup" placeholder="First Name" class="form-control">
                    </div>
                    <div class="form-group">
                        <input type="text" name="lastnameSignup" id="lastnameSignup" placeholder="Last Name" class="form-control">
                    </div>
                    <div class="form-group">
                        <input type="text" name="emailSignup" id="emailSignup" placeholder="Email Address" class="form-control">
                    </div>
                    <div class="form-group">
                        <input type="password" name="pass1Signup" id="pass1Signup" placeholder="Password" class="form-control">
                    </div>
                    <div class="form-group">
                        <input type="password" name="pass2Signup" id="pass2Signup" placeholder="Confirm Password" class="form-control">
                    </div>
                                        <div class="form-group">
                        <p class="help-block"><a href="#" class="text-green forgotPass">Forgot password?</a></p>
                    </div>
                    <input type="hidden" id="securitySignup" name="securitySignup" value="df86450b85"><input type="hidden" name="_wp_http_referer" value="/themes/reales-wp/">                    <div class="form-group">
                        <div class="btn-group-justified">
                            <a class="btn btn-lg btn-green" id="submitSignup">Sign Up</a>
                        </div>
                    </div>
                    <p class="help-block">Already a member? <a href="#" class="modal-si text-green">Sign In</a></p>
                </form>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="forgot" role="dialog" aria-labelledby="forgotLabel" aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="forgotLabel">Forgot Password</h4>
            </div>
            <div class="modal-body">
                <form role="form" id="userForgotPassForm" method="post">
                    <div class="forgotMessage" id="forgotMessage"></div>
                    <div class="form-group forgotField">
                        <input type="text" name="emailForgot" id="emailForgot" placeholder="Username or Email address" class="form-control">
                    </div>
                    <input type="hidden" id="securityForgot" name="securityForgot" value="0a8e250326"><input type="hidden" name="_wp_http_referer" value="/themes/reales-wp/">                    <div class="form-group forgotField">
                        <div class="btn-group-justified">
                            <a href="#" class="btn btn-lg btn-green" id="submitForgot">Get New Password</a>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="resetpass" role="dialog" aria-labelledby="resetpassLabel" aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="resetpassLabel">Reset Password</h4>
            </div>
            <div class="modal-body">
                <form role="form" id="userResetPassForm" method="post">
                    <div class="resetPassMessage" id="resetPassMessage"></div>
                    <div class="form-group">
                        <input type="password" name="resetPass_1" id="resetPass_1" placeholder="New Password" class="form-control">
                    </div>
                    <div class="form-group">
                        <input type="password" name="resetPass_2" id="resetPass_2" placeholder="Confirm Password" class="form-control">
                    </div>
                    <p class="help-block">Hint: The password should be at least seven characters long. To make it stronger, use upper and lower case letters, numbers, and symbols like ! " ? $ % ^ &amp; ).</p>
                    <input type="hidden" id="securityResetpass" name="securityResetpass" value="9b513fc7f8"><input type="hidden" name="_wp_http_referer" value="/themes/reales-wp/">                    <div class="form-group">
                        <div class="btn-group-justified">
                            <a href="#" class="btn btn-lg btn-green" id="submitResetPass">Reset Password</a>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="searches-modal" role="dialog" aria-labelledby="searches-label" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><span class="fa fa-close"></span></button>
                <h4 class="modal-title" id="searches-label">My Searches</h4>
            </div>
            <div class="modal-body"></div>
            <input type="hidden" name="modal-user-id" id="modal-user-id" value="0">
            <input type="hidden" id="securityDeleteSearch" name="securityDeleteSearch" value="7d1397b1b2"><input type="hidden" name="_wp_http_referer" value="/themes/reales-wp/">            <div class="modal-footer">
                <a href="javascript:void(0);" data-dismiss="modal" class="btn btn-gray">Close</a>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="propertyModal" role="dialog" aria-labelledby="propertyLabel" aria-hidden="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-body">
                <div id="save_response">
                    <div class="alert alert-danger alert-dismissible fade in" role="alert">
                        <div class="icon"><span class="fa fa-ban"></span></div>
                        <button type="button" class="close close-modal" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                        Agent account needed!                    </div>
                </div>
            </div>
        </div>
    </div>
</div>    <a href="javascript:void(0);" class="top-navHandler visible-xs"><span class="fa fa-bars"></span></a>
    <div class="top-nav" style="height: auto;">
        <div class="menu-top-menu-container"><ul id="menu-top-menu" class="menu"><li id="menu-item-225" class="xxx menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-2 current_page_item menu-item-225"><a href="http://mariusn.com/themes/reales-wp/">Home</a></li>
<li id="menu-item-556" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-556"><a href="#">Properties&nbsp;&nbsp;<span class="fa fa-angle-down"></span></a>
<ul class="sub-menu">
    <li id="menu-item-555" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-555"><a href="http://mariusn.com/themes/reales-wp/search-results/?search_city=San+Francisco&amp;search_lat=37.7749295&amp;search_lng=-122.41941550000001&amp;search_category=0&amp;search_type=0&amp;search_min_price=&amp;search_max_price=">Properties List</a></li>
    <li id="menu-item-557" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-557"><a href="http://mariusn.com/themes/reales-wp/properties/elegant-apartment/">Single Property</a></li>
    <li id="menu-item-558" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-558"><a href="http://mariusn.com/themes/reales-wp/search-results/?search_city=San+Francisco&amp;search_lat=37.7749295&amp;search_lng=-122.41941550000001&amp;search_category=0&amp;search_type=0&amp;search_min_price=&amp;search_max_price=">Search by City</a></li>
    <li id="menu-item-559" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-559"><a href="http://mariusn.com/themes/reales-wp/search-results/?search_city=San+Francisco&amp;search_lat=37.7749295&amp;search_lng=-122.41941550000001&amp;search_category=29&amp;search_type=0&amp;search_min_price=&amp;search_max_price=">Search by Category</a></li>
    <li id="menu-item-560" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-560"><a href="http://mariusn.com/themes/reales-wp/search-results/?search_city=San+Francisco&amp;search_lat=37.7749295&amp;search_lng=-122.41941550000001&amp;search_category=0&amp;search_type=10&amp;search_min_price=&amp;search_max_price=">Search by Type</a></li>
    <li id="menu-item-561" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-561"><a href="http://mariusn.com/themes/reales-wp/search-results/?search_city=San+Francisco&amp;search_lat=37.7749295&amp;search_lng=-122.41941550000001&amp;search_category=0&amp;search_type=0&amp;search_min_price=&amp;search_max_price=700000">Search by Price</a></li>
</ul>
</li>
<li id="menu-item-2459" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-2459"><a href="#">IDX&nbsp;&nbsp;<span class="fa fa-angle-down"></span></a>
<ul class="sub-menu">
    <li id="menu-item-2460" class="menu-item menu-item-type-post_type menu-item-object-ds-idx-listings-page menu-item-2460"><a href="http://mariusn.com/themes/reales-wp/idx/listings/idx-test/">dsIDXpress Listings</a></li>
    <li id="menu-item-2461" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2461"><a href="http://mariusn.com/themes/reales-wp/dsidxpress-single-listing-shortcode/">dsIDXpress Single Listing Shortcode</a></li>
    <li id="menu-item-2462" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2462"><a href="http://mariusn.com/themes/reales-wp/dsidxpress-listings-shortcode/">dsIDXpress Listings Shortcode</a></li>
</ul>
</li>
<li id="menu-item-562" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-562"><a href="#">Agents&nbsp;&nbsp;<span class="fa fa-angle-down"></span></a>
<ul class="sub-menu">
    <li id="menu-item-5446" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5446"><a href="http://mariusn.com/themes/reales-wp/our-agents/">Agents List</a></li>
    <li id="menu-item-563" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-563"><a href="http://mariusn.com/themes/reales-wp/agents/jane-smith/">Agent Page</a></li>
</ul>
</li>
<li id="menu-item-5449" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5449"><a href="http://mariusn.com/themes/reales-wp/customers/">Customers</a></li>
<li id="menu-item-269" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-269"><a href="http://mariusn.com/themes/reales-wp/blog/">Blog</a></li>
<li id="menu-item-564" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-564"><a href="#">Features&nbsp;&nbsp;<span class="fa fa-angle-down"></span></a>
<ul class="sub-menu">
    <li id="menu-item-578" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-578"><a href="http://mariusn.com/themes/reales-wp/front-end-property-submission/">Front-end Property Submission</a></li>
    <li id="menu-item-588" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-588"><a href="http://mariusn.com/themes/reales-wp/reales-wp-custom-widgets/">Custom Widgets</a></li>
    <li id="menu-item-595" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-595"><a href="http://mariusn.com/themes/reales-wp/reales-wp-shortcodes/">Reales WP Shortcodes</a></li>
</ul>
</li>
<li id="menu-item-519" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-519"><a href="http://mariusn.com/themes/reales-wp/contact-us/">Contact Us</a></li>
</ul></div>    </div>
</div><div class="home-caption">
        <h1 class="home-title">NOW IT'S EASY TO FIND YOUR FUTURE HOME</h1>
            <div class="home-subtitle">WITH REALES WP - REAL ESTATE WORDPRESS THEME</div>
            <a href="#" class="btn btn-lg btn-black">Learn More</a>
    </div>
<div class="search-panel">


        <form class="form-inline" id="searchPropertyForm" role="search" method="get" action="http://mariusn.com/themes/reales-wp/search-results/">
            <input type="hidden" name="sort" id="sort" value="newest">
                                                                <div class="form-group">
                                            <input type="text" class="form-control auto" id="search_city" name="search_city" placeholder="City" autocomplete="off">
                                        <input type="hidden" name="search_lat" id="search_lat">
                    <input type="hidden" name="search_lng" id="search_lng">
                </div>
                                                    <div class="form-group hidden-xs adv">
                    <a href="javascript:void(0);" data-toggle="dropdown" class="btn btn-white dropdown-toggle">
                        <span class="dropdown-label">Category</span>&nbsp;&nbsp;&nbsp;<span class="caret"></span>
                    </a>
                    <ul class="dropdown-menu dropdown-select">
                        <li class="active"><input type="radio" name="search_category" value="0" checked="checked"><a href="javascript:void(0);">Category</a></li>
                                                <li><input type="radio" name="search_category" value="29"><a href="javascript:void(0);">Apartment</a></li>
                                                <li><input type="radio" name="search_category" value="30"><a href="javascript:void(0);">House</a></li>
                                                <li><input type="radio" name="search_category" value="31"><a href="javascript:void(0);">Land</a></li>
                                            </ul>
                </div>
                                        <div class="form-group hidden-xs adv">
                    <a href="javascript:void(0);" data-toggle="dropdown" class="btn btn-white dropdown-toggle">
                        <span class="dropdown-label">Type</span>&nbsp;&nbsp;&nbsp;<span class="caret"></span>
                    </a>
                    <ul class="dropdown-menu dropdown-select">
                        <li class="active"><input type="radio" name="search_type" value="0" checked="checked"><a href="javascript:void(0);">Type</a></li>
                                                <li><input type="radio" name="search_type" value="10"><a href="javascript:void(0);">For Rent</a></li>
                                                <li><input type="radio" name="search_type" value="11"><a href="javascript:void(0);">For Sale</a></li>
                                            </ul>
                </div>
                                        <div class="form-group hidden-xs adv">
                    <div class="input-group">
                        <div class="input-group-addon">$</div>
                        <input class="form-control price" type="text" name="search_min_price" id="search_min_price" placeholder="Min price">
                    </div>
                </div>
                <div class="form-group hidden-xs adv">
                    <div class="input-group">
                        <div class="input-group-addon">$</div>
                        <input class="form-control price" type="text" name="search_max_price" id="search_max_price" placeholder="Max price">
                    </div>
                </div>
                                                                        <div class="form-group">
                <input type="submit" id="searchPropertySubmit" class="btn btn-green" value="Search">
                <a href="javascript:void(0);" class="btn btn-o btn-white pull-right visible-xs" id="advanced">Advanced Search <span class="fa fa-angle-up"></span></a>
            </div>
        </form>


</div>
    </div>

最佳答案

如果你想关注这个http://tympanus.net/codrops/2012/01/02/fullscreen-background-image-slideshow-with-css3/教程然后你必须将你的图像放在主题图像文件夹中或者必须将它们上传到 WordPress 中。如果您将图像上传到主题图像文件夹中并且您使用的是 style.css 那么这段代码，

.cb-slideshow li:nth-child(1) span { 
    background-image: url(images/1.jpg) 
}

如果您将 css 文件放在 css 文件夹中，那么此代码将起作用。

.cb-slideshow li:nth-child(5) span { 
    background-image: url(../images/5.jpg);
    animation-delay: 24s; 
}

如果你在 wordpress 媒体库中上传你的图片，那么只需获取图片 url 并通过它

.cb-slideshow li:nth-child(5) span { 
    background-image: url(http://example.com/wp-
    content/uploads/2016/01/1.jpg);
    animation-delay: 24s; 
}

希望对你有帮助

关于wordpress - WP 中的全屏背景图像幻灯片，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38209733/

文章推荐： css - SASS和数据属性多重

文章推荐： css - 识别用户在网页上的位置

文章推荐： html - 手机上的网格布局问题

javascript - 图像->JSON->.Net 图像
我正在尝试学习 Knockout 并尝试创建一个照片 uploader 。我已成功将一些图像存储在数组中。现在我想回帖。在我的 knockout 码(Javascript)中，我这样做: 我在 Jav
php - 如何在mysql中添加文本+图像+文本+图像+ ...？
我正在使用 php 编写脚本。我的典型问题是如何在 mysql 中添加一个有很多替代文本和图像的问题。想象一下有机化学中具有苯结构的描述。最有效的方法是什么？据我所知，如果我有一个图像，我可以在数据
html - Bootstrap 图像/按钮/图像
我在两个图像之间有一个按钮，我想将按钮居中到图像高度。有人可以帮帮我吗？ Entrar
javascript - 从中心点旋转全尺寸 Canvas 图像，而不移动其他 Canvas 图像
下面的代码示例可以在这里查看 - http://dev.touch-akl.com/celebtrations/ 我一直在尝试做的是在 Canvas 上绘制 2 个图像(发光，然后耀斑。这些图像的链接
javascript - 为什么相同的 JS 代码不适用于第二个帖子/图像，但适用于第一个帖子/图像？
请检查此https://jsfiddle.net/rhbwpn19/4/ 图像预览对于第一篇帖子工作正常，但对于其他帖子则不然。我应该在这里改变什么？ function readURL(input)
javascript - HTML Canvas 图像 - 在页面中绘制多 Canvas 图像
我对 Canvas 有疑问。我可以用单个图像绘制 Canvas ，但我不能用单独的图像绘制每个 Canvas 。- 如果数据只有一个图像，它工作正常，但数据有多个图像，它不工作你能帮帮我吗？ va
ios - 查找指定文件的扩展文件类型(JPEG 图像、TIFF 图像、...) objective c
我的问题很简单。如何获取 UIImage 的扩展类型？我只能将图像作为 UIImage 而不是它的名称。图像可以是静态的，也可以从手机图库甚至文件路径中获取。如果有人可以为此提供一点帮助，将不胜感激。
image-processing - 如何将 SVG 图像 "paths"转换为单独的 PNG 图像？
我有一个包含 67 个独立路径的 SVG 图像。是否有任何库/教程可以为每个路径创建单独的光栅图像(例如 PNG)，并可能根据路径 ID 命名它们？最佳答案谢谢大家。我最终使用了两个答案的组合。
javascript - 使一个(图像)向右移动并旋转 45 度，同时将鼠标悬停在另一个(图像)上
我想将鼠标悬停在一张图片(音乐专辑)上，然后播放一张唱片，所以我希望它向右移动并旋转一点，当它悬停时我希望它恢复正常动画片。它已经可以向右移动，但我无法让它随之旋转。我喜欢让它尽可能简单，因为我不是编
ios - Retina iOS 设备不显示@2X 图像，它显示 1X 图像
Retina iOS 设备不显示@2X 图像，它显示 1X 图像。我正在使用 Xcode 4.2.1 Build 4D502，该应用程序的目标是 iOS 5。我创建了一个测试应用(主/细节)并添加
javascript - 如何将 HTML CSS 图像 slider 转换为 Angular 图像 slider ？
我正在尝试从头开始以 Angular 实现图像 slider ，并尝试复制 w3school基于图像 slider 。下面我尝试用 Angular 实现，谁能指导我如何使用 Angular 实现？
c++ - 如何从 opencv 中的 RGB 图像(3 channel 图像)访问图像数据
我正在尝试获取图像的图像数据，其中 w= 图像宽度，h = 图像高度 for (int i = x; i imageData[pos]>0) //Taking data (here is the pr
php - HTML (或 JS 图像)与通过 PHP 的内联图像(base64_encoded 图像)
我的网页最初通过在 javascript 中动态创建图像填充了大约 1000 个缩略图。由于权限问题，我迁移到 suPHP。现在不用标准标签本身我正在通过这个 php 脚本进行检索 $file
python - 将 Python Opencv 图像(numpy 数组)转换为 PyQt QPixmap 图像
我正在尝试将 python opencv 图像转换为 QPixmap。我按照指示显示Page Link我的代码附在下面 img = cv2.imread('test.png')[:,:,::1]/2
python - OpenCV 将图像读取为 3 channel 图像，而 PIL 将图像读取为 1 channel 图像
我试图在这个 Repository 中找出语义分割数据集的 NYU-v2 . 我很难理解图像标签是如何存储的。例如，给定以下图像: 对应的标签图片为: 现在，如果我在 OpenCV 中打开标签图像，
java - 如何循环 8*1 svg 图像(由 java 生成)以获得 8*8 svg 图像？
import java.util.Random; class svg{ public static void main(String[] args){ String f="\"
Android自定义画笔图案/图像
我有一张 8x8 的图片。 (位图 - 可以更改) 我想做的是能够绘制一个形状，给定一个 Path 和 Paint 对象到我的 SurfaceView 上。目前我所能做的就是用纯色填充形状。我怎样才
HTML 图像
要在页面上显示图像，你需要使用源属性（src）。src 指 source 。源属性的值是图像的 URL 地址。定义图像的语法是：在浏览器无法载入图像时，替换文本属性告诉读者她们失去的信息。此
图像&视频编辑工具箱MMEditing安装及使用示例(Inpainting)
**MMEditing是基于PyTorch的图像&视频编辑开源工具箱，支持图像和视频超分辨率(super-resolution)、图像修复(inpainting)、图像抠图(matting)、
来自资源文件的 Qt 图像
我正在尝试通过资源文件将图像插入到我的程序中，如下所示: green.png other files 当我尝试使用 QImage 或 QPixm

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

wordpress - WP 中的全屏背景图像幻灯片